博客

5th May 2021 at 4:13pm
blog

财富管理类公司

11th April 2021 at 6:26pm
stock
东方财富

操作系统原理

11th April 2021 at 6:22pm
MyContents

成败和对错

21st April 2021 at 9:53pm
Thinker
  • 没有什么是成功的,也没有什么是是失败的,只有你自己的体验,因为外物都是空的,只有你在当下才是最美。
  • 没有什么对,没有什么错,过于追求完美就是错,敢于犯错才是美,当你敢于接纳错误时才是如水般的自在流动。
  • 在人际关系中,你对的越多就,你就错的越多,好像与舍与得的关系一致^_^

初学JSON

17th April 2021 at 7:04pm
JavaScript
  • json的全称为javascript object notation,javascript的对象描述符。
  • :连接namevalue并由一个,符号分开组成一个元素。由一对{}来包裹一个对象,[]表示数组,value可以是字符串、数值、对象、数组、false、true、null。
  • 例子:name1:vaule1,name2:value2,nam3:{lenth:100,width:200}
  • 如此简洁的语法结构,实际是也是递归的延伸,可以构造类似windows注册表那样大型的数据结构。
  • name:value,name2:{name22:value22,name33,value33}
  • 和xml类似,都是以纯为文本的形式表示数据,比xml更加的轻量化。

购买域名

7th May 2021 at 7:41am
购买域名 DNS
  • 选择一个靠谱的域名解析供应商,我选择的是阿里云。先在阿里云购买个人的域名,然后要对拥有的域名进行实名认证(这个是必须的,否则无法实现dns解析),这个和你注册的阿里云账户信息实名认证是不同的概念。
  • 域名解析设置
    • username.github.io仓库根目录下新建一个CNAME文件(无后缀名),然后用文本编辑器打开,在首行添加你的网站域名,如xxxx.com,注意前面没有http://,也没有www
    • 先添加一条记录,类型为CNAME,主机记录写@,后面记录值写上你的username.github.io
    • 再添加一条记录,类型为CNAME,主机记录写www,后面记录值也是username.github.io
  • 这样别人用www和不用www都能访问你的网站(其实www的方式,会先解析成xxxx.github.io,然后根据CNAME再变成xxx.com,即中间是经过一次转换的)。上面,我们用的是CNAME别名记录,也有人使用A记录,后面的记录值是写github page里面的ip地址,但有时候IP地址会更改,导致最后解析不正确,所以还是推荐用CNAME别名记录要好些,不建议用IP。
  • 在username.github.io仓库的setting 下,选择pages,然后自定义域名保存,会自动提示等待的时间。

股票的估值

11th April 2021 at 6:22pm
stock

做投资最怕的是“心中没底”,心中没底的人,眼看着股价越涨越高,便忍不住要去追,眼看着股价跌了又跌,有忍不住亏损出局。了解企业内在价值,用“估值的标尺”去衡量,才会解决心中没底的问题。 估值高低是相对的,通常有几种方法来衡量:

最简单就是历史比较法,将目前的动态市盈率和历史估值水平相比,看看处于什么位置,我目前主要用“芝士财富”这个软件查看。
按PEG法,估计未来三年的净利润复合增速预期值,并与当前动态市盈率值相比,通常小于1 认为低估了,例如你估计一家企业未来3年净利润复合增速可达到40%,那么动态市盈率小于40倍,可能估值就比较合理了。
按简易的现金流折现模型,假定初始净利润为1亿, 估算企业未来10年可累计创造的净利润数, 这个数如果大于当前动态市盈率可以视作低估,比如一家企业你估计未来10年能累计创造30亿净利润,那么30亿市值可以看作其内在价值,小于为低估,远大于为高估,这种方法的难点就是你要能比较准确地估算一家企业未来10年所创造的净利润(现金流)。

关于自学

4th May 2021 at 9:42am
自学 MyContents

关于TiddlyWiki保存的四种方式

24th April 2021 at 10:34am
git LearningTiddlyWiki save
  • TiddlyWiki的默认保存方式是下载全新修改版本的单文件到本地。任何修改在保存时下载一个新版本的html单文件保存到本地,即使仅改变了一个字符,或者一个设置项。这样会显得有点繁琐,所有就有下面几种保存方式。
  • 使用TiddlwyWiki的另外一个单文件版本NoteSelf。该本版集成了运行浏览器内部的的数据库PouchDB,PouchDB is an open-source JavaScript database inspired by Apache CouchDB that is designed to run well within the browser.PouchDB was created to help web developers build applications that work as well offline as they do online。NoteSelf可以实现自动保存。
  • 使用TiddlyWiki&Node.js组合。
  • 使用TiddlyWiki&GitHub组合。把单文件TiddlyWki托管在Github上,通过在TiddlyWiki的save选项设置后可以实现在线编辑、自动保存。但是因为访问GitHub的网速问题,编辑完成一个TIddler之后,再打开一次看看是否顺利保存,平时记得定期全部导出你的笔记使用Export All Tiddlers

关于TiddlyWiki用途

11th April 2021 at 6:22pm
MyOwn
零碎的知识需要系统、有机地管理、存储才有记录的价值。wiki以其得天独厚的索引、检索、组织、共享功能而特别适合学习的记录、资料的整理。特别是TiddlyWiki,无需特别安装环境,无需数据库,方便携带,特别适合个人知识的组织和管理,轻松、随意、有序。

国产替代消费电子芯片企业

11th April 2021 at 6:01pm
stock
和而泰
瑞芯微
中颖电子
全志科技

好歌收藏

11th April 2021 at 6:01pm
音乐

环境变量

11th April 2021 at 6:01pm
Windows

汇编语言

11th April 2021 at 6:01pm
MyContents

计算机原理

11th April 2021 at 6:10pm
MyContents

交通法规

3rd May 2021 at 8:33pm
MyContents

理解BCD的数据结构和BcdEdit的使用方法

25th April 2021 at 10:21am
BcdEdit

量化投资

11th April 2021 at 6:01pm
PyThon

你的情绪

21st April 2021 at 9:44pm
Thinker

你所有的想法和情绪都是你自己的。当你有各种情绪时,不必压抑,同时你要明白,所有的念头都是自己产生的,心存善念,眼里会有美好,外边什么也没有,只有你和你的世界,爱自己,爱你的世界。

你知道的越多

21st April 2021 at 9:40pm
Thinker
  • 你知道的越多,你不知道的就越多,因为你知道你自己不知道
  • 你知道的越少,你不知道的就越少,因为你不知道自己不知道

如何安装第三方插件

16th April 2021 at 7:43pm
TiddlyWikiTutorial

如何保存条目

16th April 2021 at 7:41pm
TiddlyWikiTutorial

如何导入导出条目

16th April 2021 at 7:42pm
TiddlyWikiTutorial

如何快速查询条目

16th April 2021 at 7:42pm
TiddlyWikiTutorial

如何新建一个条目

15th April 2021 at 10:16pm
TiddlyWikiTutorial
  • 点击右侧边栏顶部的+号即可新建一个Tiddler条目。
  • 一个条目的基本要素有Title、tag 、text
    • Title:就是这个短文的标题,在你所有的笔记标题中具有唯一性,如果标题重复的话会自动提示。
    • tag:是这个条目的归类,相当于给他分类,属于哪一文件夹的意思。可以根据条目的内容添加多个合适的tag名称,需要的时候可以把tag作为关键字来快速搜索这篇短文。
    • Test:就是文本编辑区,是这篇笔记的具体内容。如果要书写Markdown格式的笔记,要点击编辑区下方TYPE字段右侧的下拉箭头,选择Markdown即可书写。关于MarkDown的书写语法课参照MarkDown的参考。
    • 这三个要素输入完毕后就可以点击本条目右上角的对号按钮保存,完成这个条目。

如何在侧边栏显示目录树

15th April 2021 at 10:18pm
TiddlyWikiTutorial
  • 新建一个Tiddler条目
  • 该条目的的Title一般设置为TableOfContents,当然你可以添加Caption字段来显示自定以的任意你喜欢的标题。
  • 这个条目的tag设置为$:/tags/SideBartag的字符区分大小写
  • 复制下面这段代码到这个新建的条目的编辑区域。只要保持中间这行代码单引号里面的字符串和条目的Title相同就可以,一般用英文字母来表示这个侧边栏页标签下的根目录。
<div class="tc-table-of-contents">

<<toc-selective-expandable 'TableOfContents'>>

</div>

如何制作子条目

15th April 2021 at 10:36pm
TiddlyWikiTutorial
  • 如果规划好了,这个条目是做为父条目的,要包含若干个子条目的,最简单的办法在当前条目的右上角点击[新建]的+号,根据其提示信息:create a new tiddler tagged this one,意思就是新建一个条目,属于当前条目的tag,也就是了建立当前条目的子条目的意思。
  • 当然也可以随意建立独立的条目,根据临时的需要,根据title和tag的关联关系,建立条目包含关系。

如何自定义TiddlyWiki

16th April 2021 at 7:43pm
TiddlyWikiTutorial

生活精彩在自己

23rd April 2021 at 10:56pm
生活 MyContents
  1. 寻找自己喜欢的爱好,如果没有找到,那就继续找,直到找到为止。
  2. 找到你的爱好,有个小目标,将时间都浪费在你的爱好上吧。
  3. 爱好广泛,只要有一两个让你着迷的爱好吧。
  4. 每天要忙起来,忙的没有功夫去想那些琐碎的小事
  5. 生活有目标,长期在远方,短期就在当下。
  6. 保持运动、保持快乐的心情和美好的期待
  7. 经常喝水

数字逻辑

11th April 2021 at 6:01pm
MyContents

搜索最小字数限制

24th April 2021 at 10:46am
自定义 LearningTiddlyWiki

该知识点引用自使用 TiddlyWiki 打造轻便个人 Wiki 知识库

TiddlyWiki 默认的搜索框存在字符数限制,要求搜索关键词大于三个字符。对于英语环境来说这很合理,但是对于中文来说,二字词的搜索是很常见的,因此很不方便。修改这个设置只需要:
添加一个标题为 $:/config/Search/MinLength 的新条目
内容为 1

条目之间的关系

16th April 2021 at 7:40pm
TiddlyWikiTutorial

外边什么也没有

24th April 2021 at 12:59pm
Thinker
  • 生活里有点难,如果你遇到了,你只能跨过去,因为你的世界里没有外物,只有你自己和这个世界,只有空气、水、太阳、月亮和你生存的世界,还有你的亲人们。
  • 爱自己、爱你的亲人们、爱自己的世界,给自己加油^-^。
  • 放空自己的思绪,最快乐的自己就在当下。

系统环境变量

11th April 2021 at 6:01pm
环境变量

学习英语之-学以致用

16th April 2021 at 12:54pm
English
  • 单词只是单纯死记硬背,真的很缺乐趣,又只是硬记释义,孤零零的感觉,没办法学以致用,背完发现还是会忘记、不会用。
  • 光背单词(适合完全没有词汇量),背了个寂寞,就背了个中文释义。
  • 把单词放到语句中,单词的形象就活灵活现了。根据词性再模仿语句写作造句,体会单词在语句情景中的形象,对单词、语法、写作个人觉得很有帮助。
  • 语句本身就是一个领域知识(可能英语语法、编程知识、名言名句等)。摘抄下来的语句又是温习知识的过程。这样,单词只能在阅读中积累。那么就会有大量的英文阅读(又会涉及到一门领域知识和英语领域学习),和大量的生词难词积累。
  • 生词难词查词用词的过程又是对语法写作的大量积累。量变→质变。喜欢什么领域,就看什么领域的英文文章,阅读,积累,练习。兴趣很重要。比如喜欢看NBA,就看NAB球星的推,篮球新闻等等。
  • 保持对生活的热爱和兴趣,保持动力,终生爱上学习。

音乐

11th April 2021 at 6:59pm
MyContents

音乐编辑

11th April 2021 at 6:01pm
音乐

英语生词本

21st April 2021 at 9:45pm
English

A plain todolist

 

英语阅读的一个方法

15th April 2021 at 10:48pm
English
  • 精选几本不同领域英文书籍,坚持重复的阅读,直到你非常熟悉。
  • 坚持使用英文版的工具软件或者阅读英文的电子文档

用户环境变量Path

11th April 2021 at 6:01pm
环境变量
使用set 命令修改环境变量,仅仅适用于当前的命令行窗口的会话。例如:
set path=%path%;c:\users\ls\mynewwiki
使用setx命令修改环境变量path ,使用持久化修改环境变量path。例如:
setx path "%path%;c:\users\ls\mynewwiki"

在GitHub上写博客

5th May 2021 at 4:53pm
blog
  • 首先注册个GitHub账号
  • 每个GitHub账号可以创建一个GitHub page,仓库的名称设置为yourusername.github.io
  • 下载并安装git,学会使用git和github的通讯
  • 在阿里云上购买域名,并设置好dns解析记录。
  • 在username.github.io仓库的根目录下新建一个CNAME文件。文件名称为大写,不带扩展名。可以在本地仓库使用记事本建立一个文本文件,文件内容为你的自定义域名,前边不加www,保存后把txt的扩展名去掉即可,最后使用git命令 push到你的username.github.io仓库main分支下。
  • 在username.github.io仓库的设置参数pages里填写你的自定义域名,保存时下面吗会提示等待时间。
  • 可以再上传一个index.html的文件,就可以使用自定义的域名来访问你自己的博客了,尽管这个博客还没有什么丰富的内容,只有一个主页而已。
  • 接下里可以学习使用GitHub推荐的Jekyll来写博客。

长期可持续赚钱的底层逻辑

11th April 2021 at 6:01pm
stock

长线投资群摘录

11th April 2021 at 6:58pm
MyContents

重新生成Git访问Github仓库SSH密钥的方法

7th May 2021 at 10:10am
git Git与GitHub github

在本地上传代码到远程GitHub时,有时候会验证密码,这个密码是在生成SSH密钥的时候输入的,过后忘记的话就只能重新生成密钥了,为安全期间,Git不支持重置密码。

重新生成SSH密钥的方法:
  • 在Git Bash命令行窗口键入 cd ~/.ssh ,这个命令会跳转到本机的 .ssh目录。
  • 使用 ls 命令列出 .ssh目录下的文件内容,一般会有id_ed25519.pub 等文件,这个id_ed25519.pub就是保存密钥的。
  • ssh-keygen -t ed25519 -C "your_email@example.com"
    • 在这个命令中,-t ed25519 是采用ed25519的算法 。常见的 SSH 登录密钥使用 RSA 算法。RSA 经典且可靠,但性能不够理想。只要你的服务器上 OpenSSH 版本大于 6.5(2014 年的古早版本),就可以利用 Ed25519 算法生成的密钥对,减少你的登录时间。如果你使用 SSH 访问 Git,那么就更值得一试。Ed25519 的安全性在 RSA 2048 与 RSA 4096 之间,且性能在数十倍以上。
    • 如果是重新生成新的SSH密钥的话,会提示是否覆盖的信息,输入y ,回车即可。
    • 接下来要求输入密码。如果不设置密码的话敲回车即可。如下图所示:
    • public key 可以公开,private key不可以公开。
  • 添加密钥到你的GitHub账号。
    • 先把id_ed25519.pub的内容复制到剪贴板中
    • clip < ~/.ssh/id_ed25519.pub 如果当前目录是.ssh,则 clip < id_ed25519.pub 就可以复制到剪切板,把剪贴板的内容取出来保存为文本文件。
    • 登陆GitHub,点击右上角头像,依次进入Settings->SSH keys,点击Add SSH key,在Title中输入密钥描述信息,在Key中输入刚才复制的公钥,点击Add key。

庄子

24th April 2021 at 12:59pm
Thinker

闲暇时了解一下庄子的哲学

自动生成简洁目录

11th April 2021 at 6:01pm
MyOwn

按照自己的需要,随手新建一个Tiddler,把Tiddler的几个元素:Title、Tag、Text、Field、Caption补充完整。如此重复,直到你觉得Tiddler已经多的无法有序高效管理时,你才会想起来如何合理有序的组织这些Tiddler。(问题就代表这个一个需求,珍惜自己提出的问题)经过摸索可以理解TiddlyWiki是通过Title和Tag来组织这些Tiddler的关系的。把多个Tiddler归属与另外一个条目,这就是抽象意义上的包含。如何实现呢?把一组多个Tiddler的Tag统一输入为另外一个Tidder的Title,这样多个Tiddler就从属于这个标题的Tiddler,在关系数据库上称作一对多,多么熟悉的原理。还可以通过Tag来过滤指定的Tiddler,类似于Excel的数据项的纵向过滤,把相同的原理应用在不同的领域,似乎是创新了一个领域,事实它就是个创新。用处理数据的方法来处理笔记。 自动生成目录的具体实现:

把要统一为一组的多个Tiddler的Tag设置为上一层Tiddler的Title。
新建一个Tiddler,标题要为多个子Tiddler的Tag。
Tiddler的Type元素属性值设置为text/vnd.tiddlywiki
保存这个Tiddler就可以在这个Tiddler页面上显示多个子条目。

可以看自己写的这个Examples:contentExample

自动生成页内目录

11th April 2021 at 6:01pm
MyOwn

按照自己的需要,随手新建一个Tiddler,把Tiddler的几个元素:Title、Tag、Text、Field、Caption补充完整。如此重复,直到你觉得Tiddler已经多的无法有序高效管理时,你才会想起来如何合理有序的组织这些Tiddler。(问题就代表这个一个需求,珍惜自己提出的问题)经过摸索可以理解TiddlyWiki是通过Title和Tag来组织这些Tiddler的关系的。把多个Tiddler归属与另外一个条目,这就是抽象意义上的包含。如何实现呢?把一组多个Tiddler的Tag统一输入为另外一个Tidder的Title,这样多个Tiddler就从属于这个标题的Tiddler,在关系数据库上称作一对多,多么熟悉的原理。还可以通过Tag来过滤指定的Tiddler,类似于Excel的数据项的纵向过滤,用处理数据的方法来处理笔记,把相同的原理应用在不同的领域,似乎是创新了一个领域,事实它就是个创新,在每个Tiddler上点击tag,可以返回到上一级条目而实现了双向链接的功能,无论打开多少层跳转都可以层层返回,不是消失在一个个打开的网页而不知道来时的路(^-^)。 自动生成目录的具体实现:


 在TiddlyWIki中实现树形目录的方法

第一种方式是先建立任意个子Tiddler,把tag设置为父目录Tiddler的Tittle就可以形成树形的结构。

第二种方法是先规划好父目录,设置好父目录Tiddler的Titler,tag;再建立任意个Tiddler,这些Tiddler的tag都设置为父目录Tiddler的Tittle,这样就可以形成树形的目录结构。点击子Tiddler的tag就可以返回父目录Tiddler。


Tiddler的Type元素属性值设置为text/vnd.tiddlywiki
保存这个Tiddler就可以在这个Tiddler页面上显示多个子条目。

可以看自己写的这个Examples:contentExample

左转弯待转区

3rd May 2021 at 8:35pm
交通法规
  • 当直行指示灯和左转指示灯同时为红色,必须在停止线内停车等待。
  • 当直行信号灯变绿绿色,左转弯指示灯仍然是红的,此时可以进入左转弯待转区。
  • 当左转弯信号灯变绿绿灯时,直接完成左转或者掉头
左转和直行都是红灯时,所有车辆都必须停在停车线内。
直行绿灯、左转红灯时,左转的车辆是可以驶入待转车道等候转弯的,依然要在左转虚线车道内。
直行红灯、左转绿灯时,即使不在待转区也可直接左转,但要按照左转的虚线车道内行驶。

A Calculator for Binary Operation

Mohammad11th April 2021 at 6:01pm
exmp099 solution
A binary operation calculator
Using Tiddlywiki macro and the new mathematical expression in Tiddlywiki 5.1.20+ it is possible to create a simple binary mathematical operation.

The calculator macro

Based on an idea from A. Gloom (see also Math Macro a Simple Calculator)The below code shows the calculator macro and its helper macro calc. The calculator macro can perform four basic mathematical operations–addition, subtraction, multiplication, and division

Syntax

<<calculator input>>

Content and attributes

AttributesTypeDescription
inputrequireda valid mathematical expression to perform four basic mathematical operations addition, subtraction, multiplication, and division

Remarks

  • The first $list widget uses a regexp filter to check if the input is a valid mathematical expression.
  • The regexp pattern to validate the mathematical expression is ^(\d+([.]\d*)?|[.]\d+)(\s*[+\-*\/]\s*)(\d+([.]\d*)?|[.]\d+)$ which is defined by the $set widget. It stes a pattern for mathematical expression like a+b, a-b, a*b, and a/b. The operand a and b can be a valid number (both integer and decimal). Also spaces are allowed before, after and between operands and operator.
  • Four next $list widget each check the input to see which basic operation will be done
  • The helper macro calc receives the operation (add, subtract, multiply and divide) and its symbol (e.g. + - * /)
  • The helper macro calc first separate two operand and then perform the requested operation
  • Based on the above explanation these expressions are valid. Note to the spaces and decimal point
    • .123 + 456.32
    • 1.23 * 123.
    • 12 / 4

Examples

The below examples shows different mathematical operation using the calculator macro.

An interactive calculator

The below example shows how the calculator macro can be used with a input box to act as an interactive calculator.

Remark
The $edit-text widget uses the temporary $:/temp/calculation tiddler to store the user input
The input statement from $:/temp/calculation is then passed to calculator macro using the $macrocall widget.

A Dictionary Project

Mohammad11th April 2021 at 6:01pm
datatiddler exmp044 solution

This is a full example of using DataTiddler (dictionary or JSON tiddler) for creating a refence book or Word Dictionary. This project was created and authored by Jed Carty.

The project includes:

  1. Macros for add/remove index/value pairs from DataTiddler
  2. Macros for making search in DataTiddler
  3. Macros for listing index/value pairs
  4. A DataTiddler (here a JSON: exmp044/dictionary) to store pairs of index/value.
  5. Reveal widget is used to prevent adding term with no meaning (empty edit box)

Demo

Term:
Meaning:

Search

Search:
Type in the search box to find specific items on the list

A Direct Open for Edit on Wiki Crash

Mohammad11th April 2021 at 6:01pm
exmp105 solution
What one can do when editing or displaying a tiddler cause wiki crash?
One way is to use a ditect open for edit.

There are situation when a macro or displaying a tiddler causes problems. That are recursive and get into a "runaway" condition which never terminates, and eventually crashes the page.

Here's a little "OpenForEdit" tiddler that can help with the above situation.

Then, to bypass the DefaultTiddlers on startup, just add #OpenForEdit to the end of your URL. When the above tiddler is loaded, select the offending tiddler from the list and press the "edit" button to jump directly into edit mode, bypassing any view mode problems that tiddler may have.

A Gallery of Core Imgaes

Mohammad11th April 2021 at 6:01pm
image solution
Create a gallery of all core imgaes
The core images are svg images. To do this use the list widget and a small css as below.

Linkable image

On mouse hover the tooltip will reveal the full path of image and on click the tiddler contans the svg image will be opened.

Remarks

  • The my-gallery css class sets the height, width and margin of images
  • The list widget, list all core images
  • The -[[$:/core/images/blank]] filter exclude the blank (empty) image from listing
  • All images are linkable and on click open the related tiddler.

Clickable image

The below example shows the same gallery with clickable images. On click the tiddler name containing the image is copied to clipboard.

Remarks

  • The my-gallery css class sets the height and width of images. The margin is not used here.
  • The list widget, list all core images
  • The -[[$:/core/images/blank]] filter exclude the blank (empty) image from listing
  • The button widget uses tm-copy-to-clipboard to copy the tiddler title of containing image into clipboard. Also the title is used as tooltip to be shown on mouse hover.
  • Each image is wrapped into a button and on click the related tiddler title is copied to clipboard.

A Rdio Button Macro

Mohammad11th April 2021 at 6:01pm
solution

A radio button macro based on Using Radio Button solution by Eric Shulman

\define radio-field(fieldname values-filter)
<$list filter="$values-filter$" variable=value>
   <$radio field="$fieldname$" value=<<value>> > <<value>></$radio>
</$list>
\end
  • Example

A Simple Recursive TOC Macro

Mohammad11th April 2021 at 6:01pm
exmp112 solution
Considering the restriction with Tiddlywiki toc macro, what is a simple script to create a toc recursively?

Solution

The below macro creates a recursive macro to populate a table of contents from a parent tag.

Remarks
the toc-all macro shows all items in the tree
the exclude can be used to exclude a branch. The exclude is like -[tag[xx]]
the first filter run [title[$here$]tagging[]] list all childs (tiddlers tagged with $here$)
the second run $exclude$ is used for excluding branches
the <$link/> shows a link to the item listed in the tree
the $macrocall then recursively calls the toc-all itself, and this continues until all childern listed
the toc-all macro uses the "exclude" paramter that is dynamically updated as the recursion occurs. Each level of recursion adds the current tiddler to a list (using syntax -[[$here$]]) so that as it dives down into the tree, any tiddler that has already been visited in the current 'branch' is excluded from being visited again. This prevents infinite loops that eat up all the browser memory and eventually cause a fatal error condition

Example

A Simple Time Stamp

Mohammad11th April 2021 at 6:01pm
solution

How can we create a simple edit toolbar button to insert a time stamp?

You can do it by a simple tiddler like this:

caption: CurrentTime
condition: [<targetTiddler>!has[type]] [<targetTiddler>type[text/vnd.tiddlywiki]]
description: Insert Current Time
icon: $:/core/images/tip
shortcuts: 
tags: $:/tags/EditorToolbar
title: $:/core/ui/EditorToolbar/Time

<$action-sendmessage
	$message="tm-edit-text-operation"
	$param="replace-selection"
	text=<<now>>
/>

A Two Way Conditional View Template

Mohammad11th April 2021 at 6:01pm
solution
How to use a two way view template?
Use $list widget with emptyMessage parameter and pass the second viewtemplate by emptyMessage parameter.

Example

Use a viewtemplate for all tiddlers tagged with parent as bellow

  • if they also tagged with second format them as Template1
  • else format them as Template2
<$list filter="[is[current]tag[parent]]">
<$list filter="[<currentTiddler>tag[second]]" emptyMessage={{Template2}}>
{{Template1}}
</$list>
</$list>

The second filter will return an empty result set if the current tiddler is not tagged by second. Then, in Template2 you’d have the template that is only displayed for tiddlers tagged parent and Template1 is displayed for those tiddler tagged both with parent and second.

ActionWidgets

21st April 2021 at 10:39pm
FromTiddlerWiki Widgets

Action widgets are a special type of widget that have no visual appearance but perform an action when triggered (such as sending a message, navigating to a tiddler, or changing the value of a tiddler). Action widgets are used in association with other widgets that trigger those actions (for example, the ButtonWidget).

The following action widgets are provided:

    There are two ways to use action widgets:

    • Using the actions attribute of the triggering widget (this is the preferred way)
    • Embedding the actions within the triggering widget (an older technique that is now deprecated)

    Assigning action widgets with the actions attribute

    The action widgets are passed as a string to the actions attribute of the triggering widget. Usually, it is more convenient to use a macro to assign the action widgets to a variable. For example, here is a button that triggers two actions of sending different messages:

    \define my-actions()
    <$action-sendmessage $message="tm-home"/>
    <$action-sendmessage $message="tm-full-screen"/>
    \end
    
    <$button actions=<<my-actions>>>
    Click me!
    </$button>

    Assigning action widgets by embedding

    The action widgets need not be immediate children of their triggering widget, but they must be descendents of it. The actions are performed in sequence. Here is the above example rewritten to use embedding:

    <$button>
    <$action-sendmessage $message="tm-home"/>
    <$action-sendmessage $message="tm-full-screen"/>
    Click me!
    </$button>

    Activate the Spell Check with Codemirror

    Mohammad11th April 2021 at 6:01pm
    solution

    A possible solution would be to add a new editor preview pane that contains a plain text editor so that you could switch to it to perform spell checking and correction.

    To do so:

    • Create a new tiddler called $:/_EditorPreview
    • Tagged $:/tags/EditPreview, add a caption field containing Spell check, and the following content:
    <$edit-text tiddler=<<currentTiddler>> class="tc-spell-check-preview"/>
    
    <style>
    .tc-spell-check-preview {width:100%;}
    </style>
    

    Then select “Spell check” as the editor preview.

    It is needed to click on the preview editor textarea in order to activate spell checking and make the dotted underlines visible.

    Look at: $:/_EditorPreview

    Add a New Element to Page Controls

    Mohammad11th April 2021 at 6:01pm
    solution
    Add a new button to page controls to create a new tiddler with predefined tag and contents
    The below description explain step by step how to add a new button to pagecontrols including appearance in tools sidebar tab
    <$button class=<<tv-config-toolbar-class>> tooltip="Add new study tiddler">
       <$list filter="[<tv-config-toolbar-icons>match[yes]]">
        <span class="chunk">{{$:/core/images/new-button}}</span>
       </$list>
       <$list filter="[<tv-config-toolbar-text>match[yes]]">
          <span class="tc-btn-text"><$text text="New Study"/></span>
       </$list>
       <$action-sendmessage $message="tm-new-tiddler" tags="study" text={{AddStudyTemplate}}/>
    </$button>

    The "Page Controls" buttons that appear at the top of the sidebar (e.g., "new tiddler", "control panel", "save changes", etc.) are not stored in a single tiddler. Rather, each button definition has it's own tiddler, and these tiddlers are all tagged with "$:/tags/PageControls" to indicate that they should appear in that part of the Sidebar.

    To define your own button, create a new tiddler (e.g., "MyButton")

    1) First, add the $:/tags/PageControls tags to that tiddler. 2) Next, enter your button definition into the text area, like this: 3) Then, add a new field named "caption". In this field, enter: New Study 4) and add another new field named "description". In this field, enter: Use this button to create a new Study tiddler with default content

    Then, create a separate tiddler named "MyButtonTemplate", containing the default content you want, i.e., Source:

    Findings

    Abstract

    Once you have defined these tiddlers, it will automatically appear as a Page Control at the top of the Sidebar.

    You can re-position this button to put it the desired order alongside the other PageControls To do this, open the $:/ControlPanel (click the gear icon in the Sidebar).

    1) The $:/ControlPanel has multiple levels of "tabs" for getting to the controls you need. 2) Select the "Appearance" tab (across the top). This will show a second level of tabs: "Palette", "Story View", "Theme", "Toolbars" and "Theme Tweaks". 3) Select the "Toolbars" tab. This will show a third level of tabs, displayed vertically on the left: "Edit Toolbar", "Editor Toolbar", "Page Toolbar" and "View Toolbar". 4) Select the "Page Toolbar" tab. This will display a set of checkboxes, showing all the buttons that are tagged with "$:/tags/PageControls".

    If you've created your tiddler correctly, your new button will appear at the bottom of this list. To reposition it, just grab it with the mouse and drag it to move it within the list.

    Add Filter Search into Sidebar

    Mohammad11th April 2021 at 6:01pm
    solution
    How to add the filter search interface into the sidebar tabs?
    Follow the several steps below
    1. Press the magnifying glass next to the standard sidebar search input to open $:/AdvancedSearch
    2. From the $:/AdvancedSearch *shadows* tab, search for "AdvancedSearch/Filter"
    3. Select "$:/core/ui/AdvancedSearch/Filter" from the search results to display that tiddler in the story
    4. Edit that tiddler and add a tag: "$:/tags/SideBar"
    5. You will now have a "Filter" tab in the sidebar. Select that tab to perform filter searches with the results displayed in the sidebar.

    Extra goodness... there is a down-arrow button next to the filter search input. This button displays a dropdown list of pre-defined filter seaches. To add your own pre-defined filter searches to this dropdown list:

    1. Create a new tiddler (e.g., "MyFilterSearch") tagged with $:/tags/Filter
    2. Add a "description" field, e.g., "Apples not Oranges"
    3. Add a "filter" field containing the filter search syntax, e.g., [search[apples]!search[oranges]]
    4. Add a "list-before" field. Do not enter a value for this field. This will cause the entry to automatically appear before all other pre-defined filters in the list.

    You can create as many custom filter searches as you like by following the above steps again, using different titles, descriptions, and filter field values.

    One display issue to fix:

    The list of pre-defined filters drops down to the RIGHT of the down-arrow button. In the sidebar, this typically results in part of the list flowing off the right edge of the window, making it hard to use since you can only see part of the filter descriptions. To fix this:

    1. Change this line:

      <$reveal state=<<qualify "$:/state/filterDropdown">> type="popup" position="belowleft" animate="yes">`

      to

      <$reveal state=<<qualify "$:/state/filterDropdown">> type="nomatch" text="" position="belowleft" animate="yes">`

      This will shift the drop-down so it appears directly under the filter search input, rather than below the down-arrow button.

    Add Language Brushes to Highlight.js Using Startup Modules

    Mohammad11th April 2021 at 6:01pm
    solution

    Part i: add brush loader

    1. Make sure you have the highlight.js plugin installed.
    2. Create a new tiddler as below. Name it whatever you like, here it is called Extra brush loader.

      • title: Extra brush loader
      • type: application/javascript
      • field name: module-type
      • field value: startup
      • with the following as text field:
      exports.after = ['load-modules'];
      
      exports.startup = function startup() {
        let hljs = $tw.modules.execute('$:/plugins/tiddlywiki/highlight/highlight.js');
      
        $tw.modules.forEachModuleOfType('highlighter', function(title, module) {
          let moduleSource = $tw.wiki.getTiddlerText(title);
          console.log('loading brush: ' + title);
          $tw.utils.evalSandboxed(moduleSource, {hljs:hljs, exports:{}}, title);
        });
      };

    Part ii: add new brushes (languages)

    1. Create a new tiddler with any title you like.
    2. Set its type to application/javascript
    3. Add a new field, name it module-type and set it to highlighter
    4. Add the below line as its text field
      • if(typeof hljs !== 'undefined') {}.
    5. Download the new brush (language) you like from https://cdnjs.com/libraries/highlight.js.
    6. Open the brush you downloaded from step 5 above in a text editor and add its content between above curly brackets.
    7. Save and reload wiki
    8. For any other language to be added repeat these seven steps.

    Demo

    For a demo have a a look at: https://hoelz.ro/files/highlighter-example.html

    Remarks

    Add or Remove Tiddler Fields

    Mohammad11th April 2021 at 6:16pm
    exmp029 fieldmangler solution

    Add new fields

    How to add a new field to a series of tiddlers?
    List them and use fieldmangler to add the new filed.

    Example

    Add the new filed rank to all tiddlers tagged with exmp029

    Remarks

    1. The list widget list all tiddlers tagged with Links.
    2. The action-sendmessage widget
    3. The button widget triggers the tm-add-field and add the rank field to all those tiddlers.

    Remove fields

    How delete a field from a series of tiddlers?
    List them and use fieldmangler to delete the filed.

    Example

    Delete the filed rank from all tiddlers tagged with exmp029

    Remarks

    1. The list widget list all tiddlers tagged with exmp029 which has a field rank
    2. The action-sendmessage widget
    3. The button widget triggers the tm-remove-field and deletes rank field from all those tiddlers.

    Add Remove Tags

    Mohammad11th April 2021 at 6:01pm
    exmp024 solution

    Add or remove tags to/from a tiddler

    How a macro can add & remove tags from a tiddler with a single button?

    The below code can add an new tag to current tiddler and remove an old tag.

    \define myactions(old, new)
    <$fieldmangler>
    <$action-sendmessage $message="tm-add-tag" $param="$new$"/>
    <$action-sendmessage $message="tm-remove-tag" $param="$old$">
    </$fieldmangler>
    \end
    \define add-remove-tags(old new)
    Add <<tag $new$>> Remove <<tag $old$>>
    <$button actions=<<myactions $old$ $new$>>>{{$:/core/images/erase}}
    </$button>
    \end
    
    <<add-remove-tags OldTopics Topics>>
    • The myactions macro accpets old and new parameters, and uses the fiedmanager widget to adds the new tag and removes the old tag.
    • The add-remove-tags macro creates a button with a line of text to show which tag will be added and which will be removed. The tag macro creates a tag pill. This macro also accepts the old and new attributes as old and new tags. It can be called from any tiddler you wish (if so, the code should be placed inside a tiddler tagged with $:/tags/Macro).

    See Example 24 to illustrate how this works.

    Adding a table of contents to the sidebar

    11th April 2021 at 6:01pm
    Customise TiddlyWiki

    The standard mechanisms in ~TiddlyWiki for creating Table-of-Contents are macros known collectively as "toc" macros (click on link to learn more about macros). They use Tagging as their means of creating relationships, so be sure to review the Tagging topic tiddler if tagging is a new concept for you.

    A customisable table of contents can be added to the sidebar with the following steps:

    1. Create a tiddler called TableOfContents
    2. Give it the tag $:/tags/SideBar
    3. Set the text to
      
      <div class="tc-table-of-contents">
      
      <<toc-selective-expandable 'TableOfContents'>>
      
      </div>
    4. Add a caption field with the text Contents
    5. Add a list-after field with the text $:/core/ui/SideBar/Open

    Add entries to the table of contents by creating tiddlers tagged ~TableOfContents. An easy way is to choose new here from the tiddler toolbar of the ~TableOfContents tiddler. (if you don't see the "new here" button, click on the down arrow to see more menu options.)

    To create child tiddlers (tiddlers that come below other tiddlers), tag them with the name of the parent tiddler.

    AfterCreateRepository

    1st May 2021 at 8:37am
    Git与GitHub
    • …or create a new repository on the command line

    git init

    git add README.md

    git commit -m "first commit"

    git branch -M main

    git remote add origin https://github.com/lsgxs2019/FromGitInit.git

    git push -u origin main


    • …or push an existing repository from the command line

    git remote add origin https://github.com/lsgxs2019/FromGitInit.git

    git branch -M main

    git push -u origin main


    …or import code from another repository You can initialize this repository with code from a Subversion, Mercurial, or TFS project.

    AfterNewRepository

    3rd May 2021 at 10:49pm

    Alias and Short Name for Template

    11th April 2021 at 6:01pm
    solution
    How to use alias for template?

    Sometimes you have a template for example in a plugin with a long name like

    $:/plugins/publisher/plugin-name/template/show-raw-content

    To use a friendly and small name (alias) Tobias Beer proposed to create a new tiddler as below and use it as an alias

    title: tpcode

    {{||$:/plugins/publisher/plugin-name/template/show-raw-content}}

    Thene whenever you wish to transclude using this template use the alias name. For example to transclude myTiddler

    {{myTiddler||tpcode}}

    Alternate Message of the Day Generator

    Mohammad11th April 2021 at 6:01pm
    solution
    Assume you have messages stored in tiddlers, how to create a message of the day generator?
    Use a pattern for naming message with sequential number and match against day number of month using the now macro

    Solution

    The below solution assumes

    • message tiddlers have title like Message xx where xx is two digits number like 01 02. ... 31
    • message tiddlers have been tagged with message (this can be any other criteria like tiddlers have a field called message, so different script can be used)
    \define tid() Message $(item)$
    
    <$set name="dd" value=<<now 0DD>> >
    <$list filter="[tag[message]removeprefix[Message ]match<dd>]" variable=item>
    <$transclude tiddler=<<tid>> mode=block/>
    </$list>
    </$set>

    Remarks

    • The $set widget stores the day number of month with leading zero format <<now 0DD>>
    • The $list widget filters all tiddlers their title start with Message and remove the prefix to find the sequence number. Note to the trailing space in Message
    • It then matches against day number
    • The found item then is shown by $transclude widget. Note to mode=block
      • The tiddler parameter in $transclude is the title of message tiddler

    Another DataTiddler and Tiddler Widget

    Mohammad11th April 2021 at 6:25pm
    datatiddler exmp005 HowToCreateContentTree solution

    How dynamically create a reference in tiddler widget and access the indexes of a data tiddler

    Remarks

    • The tiddler={{{...}}} parameter is where the magic happens...
    • Within the enclosing "triple curly braces" is some "filter syntax". This syntax takes the current tiddler title and removes the text "Another" from the beginning of the title and add the suffix " Example", thus producing the correct reference to the corresponding data tiddler. Note to the spaces.
    • With this bit of magic, it will automatically display index values from the corresponding "data" tiddler.

    Related tiddlers

      Append Items to List Field

      Mohammad11th April 2021 at 6:01pm
      solution
      How can I append items to list field of a tiddler?

      Assume the output of a list widget should be appended to the end of items in a list field of a tiddler. The below example shows all tiddlers tagged with myTag are appended to the list field of $:/state/reference tiddler.

      <$button>
      <$action-listops $tiddler="$:/state/reference" $subfilter="[tag[myTag1]]"/>
      Populate list field of state reference
      </$button>

      This works using the action-listops widget.

      See also: https://tiddlywiki.com/#ActionListopsWidget

      Append Rules Pragma

      Mohammad11th April 2021 at 6:01pm
      solution

      Appending Tiddlers to a List

      Mohammad11th April 2021 at 6:01pm
      solution

      How is it possible to choose and append tiddlers to a list based on some filter criteria?

      \define addmember()
      <$tiddler tiddler="$:/temp/newproject"><$action-listops $field="members" $subfilter="[{!!newmember}]"/></$tiddler>
      \end

      Apply Custom Styles Dynamically

      Mohammad11th April 2021 at 6:01pm
      css exmp023 solution

      Tiddlywiki can dynamically apply styles to tiddlers based on filters. A filter can screen tiddlers based on some criteria.

      Example

      Assume it is desired to change the color of border of each existing or newly created tiddler has a field called xmp. To do this

      1. Create a new tiddler tagged with $:/tags/Stylesheet
      2. Put the below script inside tiddler of step 1

        \define assign-css()
        \rules only
        [data-tiddler-title="$(currentTiddler)$"].tc-tiddler-frame {
        border-color: red;
        }
        \end
        <$list filter="[all[tiddlers]has:field[xmp]]">
        <<assign-css>><br>
        </$list>
        • In the above script, the $list widget select all tiddlers has a xmp field .
        • It then calls the assign-css macro to apply the custom styles (here border-color) to selected tiddlers using the data-tiddler-title selector
        • Every newly created tiddler having a xmp filed will get this custom style.
      3. Create some test tiddlers to see the result

      Archipel TiddlyWiki toc Based on D3JS

      Mohammad11th April 2021 at 6:01pm
      solution

      Archipel is a proof of concept called that uses D3JS into Tiddlywiki to vizualize the tiddlyWiki content.

      The target is to build a tool for innovation management that will help to visualize and navigate into knowledge contained into tiddlers based on their title and tags.

      This Javascript widget for Tiddlywiki, uses a D3.js version 5.0 plugin to build a data visualization Knowledge map of tiddler's table of content, as zoomable circle packs.

      There is another taste of using D3JS by Roland known as d3trees. Discussion on d3trees can be found on Forum

      Audacity

      11th April 2021 at 6:01pm
      音乐编辑

      Audacity是一款开源、免费的专业音乐编辑器。经过初步体验,简洁的操作界面和方便灵活的选取级编辑工具,可胜任绝大部分的音乐编辑工作。对于我们常用的音乐编辑需求,基本就是对原有的歌 曲进行部分的剪裁并导出为需要的音频文件。下面就基本的MP3格式的文件剪辑做简单记录:

      一、编辑界面的布局

      二、简单的音频文件编辑

      1、新建一个Audacity项目
      2、打开FIle|Import|Audio菜单导入一个MP3文件
      3、常用的编辑菜单有select 、edit;常用的工具栏有播放、选择、复制和粘贴。
      4、编辑窗口基本就是对应两个左右声道的两个轨道,如果选择轨道区域并按下Ctrl+B后就会在单独的一个标签轨道显示新建的标签。
      5、编辑区域的选择。
      编辑区域的选择包括可以分为动态播放时的选择和静态选择。选择方式也有鼠标和键盘两种方式。不过一般在动态播放时,为确保精确选择目标编辑区域,使用键盘的的快捷键来完成区域选取。最自然的方式为播放时选择,听到需要标记的地方,使用空格键暂停播放,使用[符号来确定选择区域的开始播放位置,再按下空格键继续播放,到需要的位置再按下空格键暂停,按下键盘上的]键,确定编辑区域的结束播放位置。此时有了选择的轨道区域之后,为了方便标识和操作,可以直接按下Ctrl+B快捷键生成一个标签,输入标签的名称来标记这段选取的区域。添加标签标识一段音频轨道之后,可以选择这个标签,然后按下播放键(或则空格键),会从这段标签标识的区域开始部分进行播放,知道标签区域的结束。如果需要在这个标签之内继续编辑,需要按下暂停键p,然后继续重复使用[ ]继续选择目标区域,完成后在重新按下Ctrl+B新建一个Label 来标识这段新的音频轨道。如果需要在静态状态下修改标签音频轨道的区域,可以通过果鼠标拖动的方式、或者窗口最下端的开始和结束时间工具栏来调整音频轨道的区域范围。

      三、完成选择区域的编辑

      完成目标区域的选择后,可以直接使用剪切或者删除完成编辑。最后要记得使用文件菜单下的Export来导出编辑成功的音频文件。

      Audacity编辑界面学习链接

      Audacity编辑界面的学习(Edit)

      11th April 2021 at 6:01pm
      Audacity
      1. 看官方文档的说明,其实音频文件的编辑类似于普通文档处理器的编辑方法,先选择好要编辑的音频轨道,然后使用常用的cut、delete 、copy等进行编辑
      2. 标签的编辑

      在选择了目标音频轨道区域之后,可以给这个选择的区域添加一个命名的标签名称,可以在需要的时候重新编辑这个标签所标识的音频轨道。用鼠标悬浮在标签上时左键单击标签,此时会选中标签标识的音频轨道,同时标签的名称处于编辑状态,任何键盘的输入都只会是编辑标签的名称而已,因此需要键入回车键取消标签的编辑状态,然后就可以使用键盘来针对选中的音频轨道进行操作。

      • Labels
      1. Edit Labels是是针对标签本身进行编辑。
      2. Add Label at Selection 是对选择的区域添加标签,一般使用Ctrl+B更高效。
      • Labeld Audios 是对通过标签选择的音频轨道进行cut、delete 等操作

      Audacity编辑界面的学习(File)

      11th April 2021 at 6:25pm
      Audacity HowToCreateContentTree Journal
      File菜单项的常用项目
      1.new
      直接创建一个新的项目,如果需要编辑音频文件,需要再单独使用open或者Import来打开音频文件。
      2.open
      直接打开要编辑的音频文件开始编辑,自动新建一个project,可以在编辑完成后再单独保存这个project。
      3.save project
      可以保存当前的编辑进度,注意这里并不是保存单独的可以再别处播放的你编辑过得音频文件。
      4.Export
      这个项目是把编辑过得音频文件导出为指定格式的文件,比如导出为MP3。
      5.Import
      这个项目是在当前的project中导入一个或者多个音频文件进行编辑。new + import 相当于一个open菜单项的功能。

      Audacity编辑界面的学习(Select)

      11th April 2021 at 6:22pm
      Audacity

      选择音频轨道区域是编辑的前提,选择方法的否灵性和精确度是音频编辑软件是否好用的标志。

      鼠标在时间轴的上方单击,就可以在鼠标单击的地方开始播放音频。
      鼠标在音频轨道区域内单击,此时并不会自动开始播放,只是选择了一个播放的起始点。


      动态播放时的区域选择方法
      可以使用空格键开始播放音乐,在需要选择起始点的时候按下暂停键p,再按下表示播放起始点的[符号就可以可以选择起始点,此时再按下暂停的p键继续播放音乐(注意不能按空格键播放,空格键播放默认是整个音频的最开始的地方起播放)。当播放到需要停止的地方时按下暂停键p,再按下]键就可以选中一段待编辑的音频区域。
      当然也可以更简单:在播放过程中不暂停,在目标位置分别按下[]键就可以在播放中完成选择。


      在静止状态下的区域选择方法
      通过工具栏的放大或者缩小按钮把音频轨道缩放在适合的长度,可以看到整个音频轨道或者局部轨道。鼠标单击目标区域的大概的位置,按下Shift键,同时点按右箭头向右移动到指定的位置,松开右箭头就可以完成一段轨道区域的选择。在按下Shift键的时候,左箭头和右箭头都是在扩大选择区域的,如果需要缩小选择区域,需要在不松开Shift的同时按下Ctrl键,然后在使用左右箭头来缩小选择的区域。完成选择区域后松开键盘,可以直接按下Ctrl+B键创建一个标签来标识这段选择的音频轨道区域。在完成标签标识之前不能用鼠标单击或者键盘的其他操作,否则选择的区域会取消,需要重新选择。


      使用编辑窗口最下方的开始、终止时间面板完成区域的调整。
      这个区域的时间单位可以设置,一般可设置为小时:分钟、秒:毫秒。可以鼠标点击时间选择窗,然后在指定区域输入时间完成调整。在输入时间的时候,可以根据需要之间输入数字,也可以使用上下箭头来调整时间,只不过没有之间键入数值更精确,可以使用左右箭头在小时、分钟、秒、毫秒区域之间跳转。
      在一个区域被选择松开了鼠标和键盘,在没有建立标签的时候,不能在轨道区域做任何操作,否则选择区域就会自动取消,需要重新选择。此时如果想调整选择区域,只有通过编辑窗口最下方的时间调整工具区域进行调整。
      选择整个音轨
      选择项目中的所有的音轨

      Base Conversion

      Mohammad11th April 2021 at 6:22pm
      exmp097 solution task
      How to convert number in one base to another?
      Using the mathematical operators in Tiddlywiki 5.1.21+ it is possible to have base conversion

      Macro

      Syntax

      <<re-base  "base" "decimal input"

      Supports base-2 to base-36.

      Example

      Batch Delete Export Tiddlers

      Mohammad11th April 2021 at 6:01pm
      batch solution

      The TW built-in Advanced Search can do batch operation like batch export and batch delete of tiddlers matching a criteria

      Exporting tiddlers matching a criteria

      From: Tiddlywiki.com

      1. Open Advanced Search or click little magnifying glass next to the search area on the sidebar
      2. Click on the "Filter" tab of the Advanced Search tiddler. Only the Filter tab will allow you to export a selection of tiddlers. Filters follow a particular syntax. Click on this Filters link to learn about how to make filters.
      3. Once you have written a filter, a list of tiddlers matching the filter will appear.
      4. Now you can click on the export tiddler button to the right of the filter input field. A pop-up menu will offer you the chance to export tiddlers in multiple formats. Currently, the export formats available are:
        • CSV file format
        • JSON file format
        • Static HTML file
        • ".tid" file format
      5. Now you can click on the export tiddler button to the right of the filter input field. A pop-up menu will offer you the chance to export tiddlers in multiple formats.

      Deleting tiddlers matching a criteria

      1. Open Advanced Search or click little magnifying glass next to the search area on the sidebar
      2. Click on the "Filter" tab of the Advanced Search tiddler. Only the Filter tab will allow you to export a selection of tiddlers. Filters follow a particular syntax. Click on this Filters link to learn about how to make filters.
      3. Once you have written a filter, a list of tiddlers matching the filter will appear.
      4. Now you can click on the delet tiddlers: trash button to the right of the filter input field. A pop-up menu will ask you "Are you sure you wish to delete xx tiddler(s)?" Click Delete these tiddlers.

      Batch Edit Tiddler Title

      Mohammad11th April 2021 at 6:01pm
      solution
      How to edit the title of a group of tiddlers?

      First, a bit of history: The current version of TiddlyWiki ("TW" or "TW5") was completely re-written from the ground up several years ago to take advantage of modern browser tech such as HTML5. Additionally, in TWC, writing programmatic manipulations of tiddlers required either javascript programming or use of extra "plugins" to provide the needed syntax while in TW5, much of the programmatic syntax is provided natively within the TWCore.

      First filter the tiddlers by tag and then execute the batch edit on this group. What I want to do is to put something at the begining of each tiddler's title (like adding prefix) without changing the rest of the tittle. So in the end each tiddler will have the same prefix but different rest of the title.

      To "filter tiddlers by tag", use the <$list> widget, like this:

      <$list filter="[tag[sometag]]">
         
      </$list> 

      The <$list> widget uses the filter to find all the matching tiddlers and then loops through all the matches and sets the value of the <<currentTiddler>> variable to each title, in turn. By default, the <$list> widget will simply output the value of the <<currentTiddler>> resulting in the display of titles of all the matching tiddlers. To make the widget do something else, you need to add more syntax within the enclosing <$list>...</$list> that references the <<currentTiddler>> variable to act on each tiddler (e.g., setting a specified field value in the <<currentTiddler>>)

      For example, if you wanted to add/update a field named matched to "true", you would use the <$action-setfield> widget, like this:

      <$list filter="[tag[sometag]]">
         <$action-setfield $tiddler=<<currentTiddler>> matched="true"/>
      </$list>

      However, the above code is NOT enough to get the job done. Because the <$action-setfield> widget changes stored tiddler values, it requires a user-initiated trigger event to start the process. To achieve this, you can enclose the above <$list>...</$list> loop within a <$button> widget, like this:

      <$button>
         BUTTON TEXT
         <$list filter="[tag[sometag]]">
            <$action-setfield $tiddler=<<currentTiddler>> matched="true"/>
         </$list>
      </$button>

      So... for your this case, you might think that the code would be something like:

      <$button>
         BUTTON TEXT
         <$list filter="[tag[sometag]]">
            <$action-setfield $tiddler=<<currentTiddler>> title="...NEW TITLE HERE..." />
         </$list>
      </$button>

      However... there are a few tricky details to consider:

      First, tiddler titles are not just display text, but are used to uniquely identify each tiddler. Thus, changing a title actually copies the existing tiddler content (all fields) to another tiddler with the specified new title and renaming a tiddler actually takes TWO actions:

      • first change the title (creating a new tiddler), and then
      • delete the tiddler with the old title, like this:
      <$button>
         BUTTON TEXT
         <$list filter="[tag[sometag]]">
            <$action-setfield      $tiddler=<<currentTiddler>> title="..." /> <!-- CREATES NEW TIDDLER -->
            <$action-deletetiddler $tiddler=<<currentTiddler>> /> <!-- REMOVES OLD TIDDLER -->  
         </$list>
      </$button>

      The next problem is that TW5 syntax does not do direct text manipulation "in line", so assembling the desired new title (i.e., prepending some text to the beginning of the existing title) requires use of a little "helper" macro, like this:

      \define newTitle(prefix) $prefix$$(currentTiddler)$

      This macro takes one parameter, "prefix". The value of the parameter is rendered into the output using the $...$ syntax (i.e., "$prefix$"). The value of the current tiddler title is already available as a variable defined in the calling scope, and is referenced using the $(...)$.

      Putting it together, we get:

      \define newTitle(prefix) $prefix$$(currentTiddler)$
      <$button>
         BUTTON TEXT
         <$list filter="[tag[SOMETAG]]">
            <$action-setfield      $tiddler=<<currentTiddler>> title=<<newTitle "SOMEPREFIX">> />
            <$action-deletetiddler $tiddler=<<currentTiddler>> />
         </$list>
      </$button>

      While this works, it would be nicer if we didn't "hard code" the button label, tag to match and the prefix to be added. To do this we can move the <$button> definition into a macro, and then invoke the macro, passing in the desired values, like this:

      \define newTitle(prefix) $prefix$$(currentTiddler)$
      
      \define addPrefix(label,tag,prefix)
      <$button>
         $label$
         <$list filter="[tag[$tag$]]">
            <$action-setfield      $tiddler=<<currentTiddler>> title=<<newTitle "$prefix$">> />
            <$action-deletetiddler $tiddler=<<currentTiddler>> />
         </$list>
      </$button>
      \end
      
      <<addPrefix "ClickMe!" "sometag" "SomePrefix">>

      That should do it.

      Bcd

      25th April 2021 at 11:32am
      Windows

      BcdBoot

      25th April 2021 at 11:32am
      Bcd

      BcdEdit

      25th April 2021 at 10:14am
      Bcd

      Behavior of Svg Internal Links

      Mohammad17th April 2021 at 10:31pm
      done solution task

      An observation on behavior of links to tiddlers that are embedded into svgs (will seem out of context till I post about svg overlays for tiddler images)

      Using svg's for map & diagrams with links to tiddlers embedded into the svg code such as

      <a xlink:href="#tiddler title"> (Deprecated)

      <a href="#tiddler title">

      - - normally, full or shortened standard urls are used but "#" allows you ro target individual tiddlers inside the wiki.

      That "#tiddler title" may cue you into what will result– a permalink link in the browser address bar.

      1- The permalink url in the browser address bar will change with each different svg embedded link 2- If you close the tiddler that gets opened, the embedded svg link will not open it again while the browser address bar contains its permalink url, making it look like that embedded link doesn't work any longer 3- If you refresh the wiki without noticing the permalink url and clearing it, you will be left wondering why an unexpected tiddler displays and not your default start up tiddlers

      Best Pattern in Actions and Button Widget

      Mohammad11th April 2021 at 6:01pm
      solution
      Which pattern is better in using a button widget?
      • Pattern A
      <$button actions=""> ...</$button>
      • Pattern B
      <$button> 
      actions
      ...
      </$button>
      Jeremy Ruston

      I personally prefer a variant of style A where one uses a variable to store the action widgets instead of a separate tiddler:

      Example

      • First store the actions in a variable (here a macro)
      \define my-actions()
      <$action-navigate $to="$:/ControlPanel"/>
      <$action-setfield $tiddler="$:/SiteTitle" $value={{{ [{$:/SiteTitle}addsuffix[!]] }}}/>
      \end
      • Then pass the variable to actions attribute of a $button widget.
      <$button actions=<<my-actions>> >
      Click me to open control panel and add an exclamation mark to the site title
      </$button>
      Remark
      There is a priority in running actions given to $button actions attribute (pattern A) and those located inside $button widget (pattern B). see: Button Actions versus Button Inline Actions

      Better Performance in Filter Run

      Mohammad11th April 2021 at 6:01pm
      solution
      Which filter run faster?
      Assume you have more than 100 tiddlers in their tittle there is a "Demo" word! Some of them are hidden tiddlers, their name started with "$:/" what is the best filter to list them?
      • Case i: two search:title
      <$list filter="[search:title[exa]] -[search:title[$:]]">
      
      </$list>
      • Case ii: one search:title and negate prefix
      <$list filter="[search:title[exa]!prefix[$:/]]">
      
      </$list>
      • Answer

      This would probably be a little better:

      <$list filter="[search:title[Demo]!prefix[$]]">

      Because this way you don't make the underlying javascript look for the $ anywhere except the first character location.

      Also, yours would omit:

      X$:/My Demo

      Which might exist if a user wanted to make a system tiddler temporarily visible in the recent tiddlers sidebar.

      • Case iii
      <$list filter="[!is[system]search:title[exa]]">
      
      </$list>

      Ref: Jeremy Ruston

      There is a built-in filter operator is[system] for detecting system tiddlers, so a better choice would be:

      [!is[system]search:title[Demo]]

      Again, we filter out system tiddlers before doing the search so as to reduce the number of tiddlers that we have to search.

      More discussion

      1. Performance comparision between [is[current]] and <currentTiddler>
      2. A fast list

      BIOS

      11th April 2021 at 6:01pm
      BIOS&MBR

      BIOS&MBR

      11th April 2021 at 6:01pm
      Windows

      Block Quotes in WikiText

      22nd April 2021 at 6:56am
      WikiText

      There are two ways to produce HTML block quotes in TiddlyWiki5, one for content spread across multiple lines, and one for single line content.

      Multi-line Block Quotes

      The syntax for multi-line block quotes () is:

      Citation

      A citation can be added to the quote like this:

      CSS Classes

      CSS classes can be added to a block quote:

      The core includes the class tc-big-quote that renders block quotes with outsize double quotes:

      Single-line Block Quotes

      The single-line syntax for block quotes is actually an extension of the syntax for Lists in WikiText. For example:

      You can also nest quotes like this:

      > A top quote
      >> A subquote
      > Another top quote

      Which renders as:

      A top quote
      A subquote
      Another top quote

      You can also mix block quotes with other list items. For example:

      blog

      5th May 2021 at 4:28pm
      MyContents

      Bookmarks with ID and Links

      Mohammad11th April 2021 at 6:01pm
      solution task

      HTML bookmarks are used to allow readers to jump to specific parts of a Web page. Bookmarks can be useful if your webpage is very long. To make a bookmark, you must first create the bookmark, and then add a link to it. When the link is clicked, the page will scroll to the location with the bookmark.

      It seems it possible to make a bookmark in TW.

      Create a bookmark

      First create a bookmark using id

      <h2 id="C4">Chapter 4</h2>

      Then, add a link to the bookmark

      (Jump to Chapter 4), from within the same page

      <$link href="#C4">Jump to Chapter 4</$link>

      Jump to Chapter 4

      Check with Jeremy

      Also see this wiki uses internal-link and anchor Internal-link Demo

      BootMgr

      11th April 2021 at 6:01pm
      BCD

      Build Name from Complex Parts

      Mohammad11th April 2021 at 6:01pm
      solution

      How we can create tabs from complex part of texts? Assume these parts are stored in tiddler fields

      <$wikify name=Résumé text='{{!!released}} {{!!author}}-Résumé'>
      <$wikify name=Notes text='{{!!released}} {{!!author}}-Notes'>
      <<tabs "[<Résumé>] [<Notes>]" "Click the little link">>
      
      </$wikify>
      </$wikify>
      • Pitfall
      Jeremy Ruston

      Just to point out a pitfall of that approach – the tranclusions and will be wikified, so if you have an author Mary McManus, then their second name would be turned into a link.

      If you want to display those fields without wikifying them, then use the <$text text={{!!released}}/> or <$view field="released"/> widgets.

      Button Actions versus Button Inline Actions

      Mohammad11th April 2021 at 6:01pm
      solution

      Button CSS Class

      Mohammad11th April 2021 at 6:01pm
      solution
      How customize a button using the CSS class?
      The $button widget has a CSS class which lets to customize the appearance of a button.

      Example

      Create a class to set yellow as button background and cyan on mouse hover.

      Remarks

      There are ready to use classes in Tiddlywiki core can be used for button for example,set class to tc-btn-invisible tc-tiddlylink to have a button look like an internal link.

      Buttons to Sort Tiddlers in Tagpill

      Mohammad11th April 2021 at 6:01pm
      exmp047 solution
      How to add a sort button to tagpill dropdown menu?
      Put a sorting macro in a tiddler tagged with $:/tags/TagDropdowb.

      Example

      Develop a buttons to sort tiddlers in ascending or descending order and add them to dropdown menu in tagpill.

      The below code does the job, create a new tiddler, name and tag it as below and put the code inside it. * Title: macro/sort-tagged-tiddlers (or whatever you want) * Tag: $:/tags/TagDropdown

      \define tagSortFunc(mainTag, order:"ascend")
      
      <$reveal type="match" default="ascend" text=<<__order__>> >
      <$action-listops  $tiddler=<<__mainTag__>>  $filter="[tag<__mainTag__>sortan[]]"/>
      </$reveal>
      
      <$reveal type="nomatch" default="ascend" text=<<__order__>> >
      <$action-listops  $tiddler=<<__mainTag__>>  $filter="[tag<__mainTag__>!sortan[]]"/>
      </$reveal>
      
      
      \end
      
      \define sortInTagDropdown()
      
      <$button tooltip="Sort tiddlers A → Z" aria-label="Sort tiddlers A → Z" class='tc-btn-invisible'>Sort {{!!title}} tiddlers A → Z
      <$macrocall $name="tagSortFunc" mainTag={{!!title}}/>
      </$button>
      
      <$button tooltip="Sort tiddlers Z → A" aria-label="Sort tiddlers Z → A" class='tc-btn-invisible'>Sort {{!!title}} tiddlers Z → A
      <$macrocall $name="tagSortFunc" mainTag={{!!title}} order="no-ascend"/>
      </$button>
      
      \end
      
      <<sortInTagDropdown>>

      Remarks

      • The sortInTagDropdown create two buttons for ascending and descending sort order
      • It then calls the tagSortFunc to sort alphanumerically the tiddlers tagged with the current tag

      See it in action

      Example 37 impelemnt the above code. To see it in action click on a tagpill and see the two new buttons

      • Sort tiddlers A → Z and
      • Sort tiddlers Z → A

      Similar topics

      The below topics are related to sort items

      1. Create a Doubly Sorted Table
      2. List by Tag but Sort and Show by Field Value
      3. List Contact Tiddlers Based on a Category
      4. Multiple Sort Rules in TOC
      5. Sort Tag Wizard
      6. Sort Tiddlers in Tag Pill
      7. Sorting in Table of Contents

      C:\Users\ls\mynewwiki\tiddlers\$__StoryList.tid

      11th April 2021 at 6:01pm

      C/C++

      12th April 2021 at 7:22pm
      MyContents

      C语言指针的各种花式应用

      12th April 2021 at 7:25pm
      指针 C/C++ c语言
      int * pi ;
      float * pf;
      double * pd ;


      int a[4];
      float f[4];
      char c[10];

      • 指针与数组
      1.指向数组的指针

      2.指针数组

      • 指针与函数
      返回指针的函数
      char * p(char *p1,char* p2);
      指向函数的指针
      char (*p)(char *p1,char * p2);


      • 函数指针数组(指向函数的指针数组)

      C语言中指针的理解

      12th April 2021 at 8:06pm
      指针 C/C++ C语言指针
      指针变量也是一种数据类型,在计算机中也要分配地址空间。

      所谓的“指针类型的数值”,实际上是指内存地址
      既然指针类型变量的数值就是地址,那指针类型可以叫做地址类型。就是专门用来存放地址类的数据。取了个难懂的名字叫做指针,以前业余自学C语言,搞不懂指针,我被忽悠了很多年(^-^),今天又好像明白了点。
      我忽然觉得应该就叫做地址类型,这样称呼的话,指针的神秘面纱没有了,他就是一个地址。
      现在来再问为何要发明这个指针类型呢?或者叫做地址类型,因为每一个变量都要分配一个地址,cpu要从内存中要读取一个变量值,第一步是要知道这个变量的地址,带着这个地址到内存中取数据。像是我们

      定义不同的指针类型,他们的寻址能力不一样,int * 能寻址4个字节,每个指针偏移一个单位,就是4个字节;double * 能寻址8个字节,指针偏移一个单位就是8个字节。
      如果你定义的是一个结构体,如果结构体如下: typedef struct example{ int a; double b; char c; }
      EXAMPLE;如果你定义一个EXAMPLE *test;那么EXAMPLE *这个指针结构的寻址能力就是整个结构体共13个字节(其实并不是13个字节)。明白这一点,你就可以理解VC编程中的句柄的概念,以及C++类定义成指针为什么能找到自己的内部成员。

      • 以int 指针为例说明指针的赋值
      int i =10;
      把I的地址赋值给指针pi;
      int *pi = &i ;
      涉及到指针操作的两个操作符& 和*都出现了。
      对于复杂的指针表达式的解析方法:出现*号,就表明后面这个名称是存储地址的指针,一个表达式中有多个星号的出现,就代表是多级指针。一个指针变量指向了另外一个指针变量,形成多级指针,或者指针链条,或者直接叫做地址链条。
      当一个指针变量被赋予于地址值后,就可以使用*操作符来取值,*号后面跟跟一个指针变量*p,就代表到p持有的内存地址处读取数据,能读取到的数据可以是任何他指向的数据,int 、float、double 等具体的数值,也开始是另外一个地址,如果通过指针的地址读取到还是一个地址,那就是地址之间的来回跳转,多个连续的地址,是不是就形成地址链条了呢。
      int * (*(*p))
      可以从内向外分析:第一个(*p) 就表示到p保存的地址出取值,在(*p)的左边又出现了一个*,表示(*p)取出的数值还是地址。
      (*p) -> *(*p) -> *(*(*p))
      理解这个最好自己画个内存的地址草图,模拟一下取值的地址跳转过程,有这个地址的操作概念即可。
      代码不是都这么
      总之一条,指针他就是个地址的代名词,也许是为了抽象吧,如果直接叫地址类型的变量也许会更容易理解。

      C指针详解

      30th April 2021 at 9:53am
      指针

      int p; 这是一个普通的整型变量

      int *p; 首先从P 处开始,先与*结合,所以说明P 是一个指针,然后再与int 结合,说明指针所指向的内容的类型为int 型.所以P是一个指向整型数据的指针

      int p[ 3]; 首先从P 处开始,先与[]结合,说明P 是一个数组,然后与int 结合,说明数组里的元素是整型的,所以P 是一个由整型数据组成的数组

      int *p[ 3]; 首先从P 处开始,先与[]结合,因为其优先级比*高,所以P 是一个数组,然后再与*结合,说明数组里的元素是指针类型,然后再与int 结合,说明指针所指向的内容的类型是整型的,所以P 是一个由返回整型数据的指针所组成的数组

      int (*p)[ 3]; 首先从P 处开始,先与*结合,说明P 是一个指针然后再与[]结合(与"()"这步可以忽略,只是为了改变优先级),说明指针所指向的内容是一个数组,然后再与int 结合,说明数组里的元素是整型的.所以P 是一个指向由整型数据组成的数组的指针

      int **p; 首先从P 开始,先与*结合,说是P 是一个指针,然后再与*结合,说明指针所指向的元素是指针,然后再与int 结合,说明该指针所指向的元素是整型数据.由于二级指针以及更高级的指针极少用在复杂的类型中,所以后面更复杂的类型我们就不考虑多级指针了,最多只考虑一级指针.

      int p( int); 从P 处起,先与()结合,说明P 是一个函数,然后进入()里分析,说明该函数有一个整型变量的参数,然后再与外面的int 结合,说明函数的返回值是一个整型数据

      Int (*p)( int); 从P 处开始,先与指针结合,说明P 是一个指针,然后与()结合,说明指针指向的是一个函数,然后再与()里的int 结合,说明函数有一个int 型的参数,再与最外层的int 结合,说明函数的返回类型是整型,所以P 是一个指向有一个整型参数且返回类型为整型的函数的指针

      int *(*p( int))[ 3]; 可以先跳过,不看这个类型,过于复杂。从P 开始,先与()结合,说明P 是一个函数,然后进入()里面,与int 结合,说明函数有一个整型变量参数,然后再与外面的*结合,说明函数返回的是一个指针,,然后到最外面一层,先与[]结合,说明返回的指针指向的是一个数组,然后再与*结合,说明数组里的元素是指针,然后再与int 结合,说明指针指向的内容是整型数据.所以P 是一个参数为一个整数据且返回一个指向由整型指针变量组成的数组的指针变量的函数.

      • 说到这里也就差不多了,我们的任务也就这么多,理解了这几个类型,其它的类型对我们来说也是小菜了,不过我们一般不会用太复杂的类型,那样会大大减小程序的可读性,请慎用,这上面的几种类型已经足够我们用了.
      个人的理解:
      • 指针在C语言中的其实就是地址,用来表示内存中变量的地址,从而可以灵活的操作数据。指针变量就专门保存地址的变量
      • 一级指针,直接指向某个的定的数值,比如指向整数类型变量的指针。
      • 二级指针,就是两个地址链接起来
      • 三级指针,即使三个地址链接起来。
      • N 级指针,就是一个地址链。^-^

      Camel Case Words in List Output

      Mohammad11th April 2021 at 6:01pm
      solution variable
      The problem of wikification of camel case word in list output
      Use text widget

      Problem

      <ol>
      <$list filter="[tag[100.02]]" variable="myTid">
      <li> <<myTid>></li>
      </$list>
      </ol>

      Solution

      <ol>
      <$list filter="[tag[100.02]]" variable="myTid">
      <li><$text text=<<myTid>> /></li>
      </$list>
      </ol>

      Canonical URI and External Image

      Mohammad11th April 2021 at 6:01pm
      solution
      What is _canonical_uri?
      It lets you wrap an external tiddler into a tiddler so that you can refer to it more easily.

      Example

      For example, create a tiddler titled MyImage with the type image/jpeg and the _canonical_uri field set to images\anatomy.jpg. Then you can embed it as an image with [img[MyImage]] or {{MyImage}}.

      The advantage of using it is that you can subsequently change the URL of the image just by changing it in a single place.

      Center Table Horizontally

      Mohammad11th April 2021 at 6:01pm
      solution
      How can center table horizontally in a tiddler:
      Create a tiddler tagged with $:/tags/Stylesheet and put the below css code inside it.
      .tc-tiddler-body table.centered{
          margin:0 auto;
      }

      Change Body Font Size

      Mohammad11th April 2021 at 6:01pm
      solution

      Other Ref: JD

      Font size:

      How to change the body font?

      To change the body font size and line height the below two system tiddlers are used

      Here a code has been developed to use a select widget to handle body font sizing. To see the code edit this tiddler. Here based on the font size the line height is changed. A new range operator from TW5.1.18 is used to generate a list of font sizes. The line height here is set in two values, for small font 22px and for big font 26px line height is used.

      Change Border Color in Search Bar

      Mohammad11th April 2021 at 6:01pm
      solution task
      textarea, input[type="text"], input[type="search"], input[type=""], input:not([type]) { padding-left: 0.2em; padding-bottom: 0.175em; -webkit-appearance: none; -moz-appearance: none; }
      .tc-sidebar-lists .tc-search { margin-top: 40px; margin-bottom: 20px; position: relative; z-index: 10; }
      
      .tc-search input[type="search"] { border: 2px inset black; box-sizing: border-box; margin: 0; }
      .tc-search input[type="search"]:focus { border: 2px inset red; box-sizing: border-box; margin: 0; }

      Note the two last lines, they demonstrate how to address the search field in the sidebar AND in the advanced search at the same time. The very last line shows how to change the border color when the field has the focus.

      The first line in the code adds some spacing between borders and content of most fields in TW and probably makes sure mobile browsers do not apply their own styles. I don’t know if this is still necessary. The second line adds some whitespace above and below the search field in the sidebar, just a matter of taste I guess.

      Change Password on Tiddlyspot

      Mohammad11th April 2021 at 6:01pm
      solution

      You can change your password from your control panel.

      Get to your control panel using a URL like this:

      http://your-site-name.tiddlyspot.com/controlpanel/

      For example if your wiki is kookmae, then use the below address

      http://kookma.tiddlyspot.com/controlpanel/
      1. Enter the current password
      2. Choose a new password
      3. Retype it and press Update

      Change the Background Color of Sidebar

      Mohammad11th April 2021 at 6:01pm
      solution
      How change the background color of sidebar
      Target the CSS element tc-sidebar-scrollable

      Solution

      1. Create a new tiddler
      2. Tag it with $:/tags/Stylesheet
      3. Customize tc-sidebar-scrollable

      Example

      To change the whole sidebar background to yellow, use the below CSS

      .tc-sidebar-scrollable{
         background-color:yellow;
       }

      Remarks

      To adjust the wiki title and subtitle, customize the tc-sidebar-header. For example try the below CSS

      .tc-sidebar-header{
       margin-top:-33px;
       }
      

      Change the Color of Sidebar Tabs

      Mohammad11th April 2021 at 6:01pm
      solution

      The below css can change the sidebar tabs color:

      /*sidebar tab buttons*/
      .tc-sidebar-lists .tc-tab-buttons button 
      { 
       color: #FFFFFF;
       background-color: #7499DA;
      }
      
      /*sidebar tab buttons when selected*/
      .tc-sidebar-lists .tc-tab-buttons button.tc-tab-selected {
       color: #FFFFFF;
       background-color: #4A7ACF;
      }

      Change the Colors of One Editor Toolbar Button

      Mohammad11th April 2021 at 6:01pm
      solution
      How to change the background color of list-bullet button in Tiddlywiki editor toolbar?
      Use the below CSS. It is possible to change the background color of all butons in a similar way.

      Create a tiddler Tag it with $:/tags/Stylesheet Put the below CSS inside the tiddler body (text)

      .tc-editor-toolbar > .tc-reveal > button {
           display: inline-flex;
           padding: 0; 
      }
      
      .tc-editor-toolbar button .tc-image-button {
           padding: 2px;
           font-size: 1.25em;
      }
      
      .tc-editor-toolbar button .tc-image-list-bullet {
           display: flex;
           align-items: stretch;
           justify-content: stretch;
           fill: red;
           background-color: yellow;
      }

      Remark

      If you need to change the background color of all toolbar buttons change the last part of above CSS as below:

      .tc-editor-toolbar button {
           display: flex;
           align-items: stretch;
           justify-content: stretch;
           fill: red;
           background-color: yellow;
      }

      Extra

      you can also add a width to the svg to make it narrower, specially if it used on mobile.

      .tc-editor-toolbar button .tc-image-button {
           padding: 4px 0px;
           font-size: 1.45em;
           width: 30px;
      }

      Check if Macro or Variable Exists

      Mohammad11th April 2021 at 6:01pm
      exmp052 solution
      How to check if a macro / variable exists?

      A new subfilter [is[variable] has been introduced in Tddly 5.1.20 to support checking the existence of a macro variable.

      Syntax

      [[VAR_NAME]] +[is[variable]addsuffix[ is a variable]] ~[[Undefined variable or macro 'VAR_NAME']]
      
      [[currentTiddler]] +[is[variable]addsuffix[ is a variable]] ~[[Undefined variable or macro ‘currentTiddler']]

      Example i

      The below macro was proposed by S.S. and works as expected.

      \define variable-test(var)
      <$list filter="[[$var$]] +[is[variable]]" emptyMessage="''$var$'' - //Undefined variable or macro//">
      ''$var$'' - Existed variable or macro
      </$list>
      \end
      
      1. <<variable-test list-links>>
      
      2. <<variable-test list-linkss>>

      See in Example 52: Check if Variable Macro Exists the new subfilter in action.

      Example ii

      Mal has proposed the below simple syntax

      {{{ [[myMacro]] +[!is[variable]addsuffix[ is not defined]] }}}

      This should produce "myMacro is not defined" or nothing if the macro or variable is defined.

      Check if Passed the Macro Parameter

      Mohammad11th April 2021 at 6:01pm
      solution
      How to check if the macro parameter has not been passed;
      Use an empty value and use a list widget to check it.
      \define mm(argIn:"Empty")
      <$list filter="[<__argIn__>] -Empty">
      Do my job!
      </$list>
      \end
      
      <$button>Check
      <<mm test>>
      </$button>

      Remarks

      • If no value for argIn passed, then it will get the default value Empty
      • The filter then "[<__argIn__>] -Empty" then will return nothing and the list widget will not run
      • So, the script between <$list and </$list> will be ignored.

      Alternative i

      A rather robust solution is proposed by BTC as below

      \define macro2(param)
      <$list filter="[<__param__>minlength[1]]">
      
      Do my job!
      </$list>
      \end

      In this method, if param has not been passed the minlength[1] returns nothing. This operator means the input should have at least one character.

      Alternative ii

      Bimlas in forum proposed this alternative, in that the macro is blank

      \define mymacro(argIn)
      <$list filter="[<__argIn__>] -[[]]">
      
      Do my job!
      </$list>
      \end
      
      <$button>Check
      <<mymacro test>>
      </$button>

      Check if Tiddler Exist

      Mohammad11th April 2021 at 6:01pm
      solution
      How to check if a title refere to an existing tiddler;
      Use the is or has operator.

      Any of below form may be used

      [is[tiddler]]   [!is[missing]] [has[title]]

      Example i

      The below example uses [is[tiddler]] and only lists the existing tiddlers. So, it seems c is not a tiddler.

      Example ii

      The below example uses [is[missing]] and only lists the non-existing tiddlers e.g. missing tiddlers. So, it seems TalhaTid is not a tiddler.

      Example iii

      The below example uses [has[title]] and only lists only the existing tiddlers. So, it seems TalhaTid is not a tiddler.

      Check if Tiddler Newer Than the Other

      Mohammad11th April 2021 at 6:01pm
      exmp054 solution
      How to check if a tiddler is newer than the other?
      Compare the modified time of two tiddlers
      \define is-thisTid-newer(TidA, TidB)
      <$set name="tidAMod" value={{{ [[$TidA$]get[modified]] }}}>
      <$set name="tidBMod" value={{{ [[$TidB$]get[modified]] }}}>
      <$list filter="[<tidAMod>] [<tidBMod>] +[nsort[]last[1]removesuffix<tidAMod>]">
      Yes, $TidA$ is newer
      </$list>
      <$list filter="[<tidAMod>] [<tidBMod>] +[nsort[]last[1]removesuffix<tidBMod>]">
      No, $TidA$ is older
      </$list>
      </$set>
      </$set>
      \end

      Remarks

      1. The first two $set widgets get the date of modification of two tiddlers and stores in related variables
      2. The first $list widget uses a smart filter to determine if tidAMod is greater than tidBMod.
      3. The second $list widget uses a smart filter to determine if tidBMod is greater than tidAMod.

      This is another solution

      Here the $reveal widget has been used! This is a little longer code in comparison to the above solution. See for more infor BTC.

      \define is-newer(TidA, TidB)
      <$set name="tidAMod" value={{{ [[$TidA$]get[modified]] }}}>
      <$set name="tidBMod" value={{{ [[$TidB$]get[modified]] }}}>
      <$reveal type="match" text="yes" default={{{ [<tidAMod>] [<tidBMod>] +[nsort[]last[1]remove<tidBMod>addprefix[yes]removesuffix<tidAMod>] ~[[no]] }}}>
      $TidA$ is newer
      </$reveal>
      <$reveal type="match" text="no" default={{{ [<tidAMod>] [<tidBMod>] +[nsort[]last[1]remove<tidBMod>addprefix[yes]removesuffix<tidAMod>] ~[[no]] }}}>
      $TidB$ is newer
      </$reveal>
      </$set>
      </$set>
      \end

      Checkbox Like Radio Button - New Solution

      Mohammad11th April 2021 at 6:01pm
      solution task

      Checkbox with Three State

      Mohammad11th April 2021 at 6:01pm
      solution

      See also

      Checkboxes Like Radio Button

      Checkboxes Like Radio Button

      Mohammad11th April 2021 at 6:01pm
      solution
      L <$checkbox field=status checked="L" unchecked="R"/>
      R <$checkbox field=status checked="R" unchecked="L"/>

      Left Right

      See also

      Checkbox with Three State

      Doc also Checkbox Like Radio Button - New Solution

      Chnage Colors and Styles of Control Buttons

      Mohammad11th April 2021 at 6:01pm
      solution

      There are better code, see: kookma/stylesheet/tw-adjustment

      *ICONS*/
      html body.tc-body .tc-image-edit-button {stroke: white;fill:#000;}
      html body.tc-body .tc-image-delete-button {stroke: white;fill:#ff2222;}
      html body.tc-body .tc-image-cancel-button {stroke: white;fill:#ffdd55;}
      html body.tc-body .tc-image-done-button {stroke: white;fill:#99ee22;}
      html body.tc-body .tc-image-home-button {stroke: white;fill:#5778d8;height:20px;}
      html body.tc-body .tc-image-palette {stroke: white;fill:#7897fc;}
      html body.tc-body .tc-image-new-button {stroke: white;fill:#7897fc;}
      html body.tc-body .tc-image-heading-1 {stroke: white;fill:#7897fc;}
      html body.tc-body .tc-image-favicon {stroke: white;fill:#7897fc;}
      html body.tc-body .tc-image-stamp {stroke: white;fill:#ff2277;}

      Cloning Tiddlers

      Mohammad11th April 2021 at 6:01pm
      solution
      How to clone tiddlers programmatically?

      The purpose is to clone a tiddler silently using Tiddlywiki scripts.

      \define clone(newTid,Template)
      <$action-createtiddler $basetitle=$newTid$ $savetitle="temp" />
      <$list filter="[<__Template__>fields[]] -title" variable=fname >
      <$set name="fval" tiddler=<<__Template__>> field=<<fname>> >
      <$action-setfield $tiddler={{temp}} $field=<<fname>> $value=<<fval>> />
      </$set>
      </$list>
      \end

      Remarks

      • The action-createtiddler widget creates a new tiddler using basetitle and save it in a temp tiddler
      • The list widgets iterated over all fileds except the title and set them for the new tiddler. These include tags, creator, created, ... fileds
      Note
      It is required to iterate over all fileds using this method. You can also use the method by Mark below, but it needs a unique title.

      Example

      The below example makes 5 clones of testTemplate.

      <$button>Clone me
      <$list filter="[range[1,5]addprefix[b00]]">
      <$macrocall $name=clone newTid=<<currentTiddler>> Template=testTemplate />
      </$list>
      </$button>

      Alternatives

      Other solution has given here, each has pores and cons.

      Solution by FrD

      A code to clone a tiddler and remove filed2 from it.

      Ref: FrD

      • Create a tiddler, for instance "testtemplate" with a tag ("MyTag"), some text and two fields : field1 and field2.
      • Create a tiddler, say "testcreate" with this code inside :
      \define actions()
      <$action-setfield $tiddler="testtemplate" $field="title" $value="MyNewTiddler" />
      <$action-deletefield $tiddler="MyNewTiddler" $field="field2" />
      \end
      
      <$button actions=<<actions>>>
      Create and remove field
      </$button>

      Solution by Mark

      Ref: Mark

      • Create a unique title (possibly title plus date stamp).
      • Use action-setfield to create new tiddler with the new, unique title.

      Close all Tiddlers and Open Home

      Mohammad11th April 2021 at 6:01pm
      button message solution
      Have a button to navigate back to my home tiddler and close all other tiddlers
      <$navigator story="$:/StoryList" history="$:/HistoryList">
          <$button class="tc-btn-invisible tc-tiddlylink">
              {{$:/core/images/home-button}} Home
              <$action-sendmessage $message="tm-close-all-tiddlers" />
              <$action-navigate $to="PLACE_TITLE_OF_HOME_TIDDLER_HERE"/>
          </$button>
      </$navigator>

      Explanation

      • The tm-close-all-tiddlers message handles actually closing all tiddlers, by sending that message up to the navigator widget.
      • Then the action navigate widet actually opens your "HOME" tiddler.
      • The class="tc-btn-invisible tc-tiddlylink" in the button just adds a bit of styling.

      A working example

      Go to https://tiddlywiki.com, make a new tiddler and paste the following:

      <$navigator story="$:/StoryList" history="$:/HistoryList">
          <$button class="tc-btn-invisible tc-tiddlylink">
              {{$:/core/images/home-button}} Home
              <$action-sendmessage $message="tm-close-all-tiddlers" />
              <$action-navigate $to="ButtonWidget"/>
          </$button>
      </$navigator>

      This will close all tiddlers and navigate to "ButtonWidget" tiddler.

      Related solutions

      These solutions are similar:

      Code Blocks in WikiText

      22nd April 2021 at 6:56am
      WikiText

      You can use triple backticks ``` to mark code blocks ():

      ```
      This will be monospaced
      ```
      

      Renders as:

      This will be monospaced

      To be interpreted correctly, the three backticks need to be at the start of the line and immediately followed by a line-break.

      Be aware that any preceding paragraph content should be properly terminated with a double line break, too. So, this example is wrong:

      This is an ordinary paragraph
      ```
      This will be monospaced
      ```
      

      The correct version is:

      This is an ordinary paragraph
      
      ```
      This will be monospaced
      ```
      

      Note that some keyboard layouts treat the backtick as a dead key, making it hard to type. The trick is to type three backticks followed by a space. Alternatively, type all six backticks in one go, then a space, and then move the cursor back three characters to type or paste the content.

      Colorful Tab

      Mohammad11th April 2021 at 6:01pm
      solution tabs

      Tabs macro

      The tab created by tabs macro can be colorful as below:

      • create a custom class
      • customize based on nth-child
      • call tabs using that class
      <style>
      .cls2  .tc-tab-buttons button:nth-child(1) {background:blue; color:white;}
      .cls2  .tc-tab-buttons button:nth-child(2) {background:red; color:white;}
      .cls2  .tc-tab-buttons button:nth-child(3) {background:green; color:white;}
      </style>
      
      <<tabs "one two three" class:"cls2">>

      More info:

      Solution by Ton Gerner

      In my own theme I use the following for Sidebar tabs and the vertical More sidebar tabs:

      /* SIDEBAR TABS */
      .tc-sidebar-lists .tc-tab-buttons button {
           color: #0044BB;
           background-color: #FFFFFF;
           border: 1px solid #D1DDF3;
           border-radius: 0.3em;
      }
      
      .tc-sidebar-lists .tc-tab-buttons button.tc-tab-selected {
           font-weight: bold;
           color: #0044BB;
           background-color: #D1DDF3;
           border: 1px solid #A2BBE6;
           border-radius: 0.3em;
      }
      
      /* SIDEBAR 'More' TABS */
      .tc-more-sidebar > .tc-tab-set > .tc-tab-buttons > button {
           background-image: none;
           background-color: #FFFFFF;
           border: 1px solid #D1DDF3;
      }
      .tc-more-sidebar > .tc-tab-set > .tc-tab-buttons > button.tc-tab-selected {
           background-image: none;
           background-color: #D1DDF3;
           border: 1px solid #A2BBE6;
      }

      Colors

      Mohammad11th April 2021 at 6:01pm
      solution

      For more information see: w3schools

      All modern browsers (and TW5!) support the following 140 color names (case insensitive!):

      Example:

      @@color:white;background-color:red;This is white text on a red background@@

      renders as: This is white text on a red background

      Color NameHEXColor
      AliceBlue#F0F8FF
      AntiqueWhite#FAEBD7
      Aqua = Cyan#00FFFF
      Aquamarine#7FFFD4
      Azure#F0FFFF
      Beige#F5F5DC
      Bisque#FFE4C4
      Black#000000
      BlanchedAlmond#FFEBCD
      Blue#0000FF
      BlueViolet#8A2BE2
      Brown#A52A2A
      BurlyWood#DEB887
      CadetBlue#5F9EA0
      Chartreuse#7FFF00
      Chocolate#D2691E
      Coral#FF7F50
      CornflowerBlue#6495ED
      Cornsilk#FFF8DC
      Crimson#DC143C
      Cyan = Aqua#00FFFF
      DarkBlue#00008B
      DarkCyan#008B8B
      DarkGoldenRod#B8860B
      DarkGray / ~DarkGrey#A9A9A9
      DarkGreen#006400
      DarkKhaki#BDB76B
      DarkMagenta#8B008B
      DarkOliveGreen#556B2F
      DarkOrange#FF8C00
      DarkOrchid#9932CC
      DarkRed#8B0000
      DarkSalmon#E9967A
      DarkSeaGreen#8FBC8F
      DarkSlateBlue#483D8B
      DarkSlateGray / ~DarkSlateGrey#2F4F4F
      DarkTurquoise#00CED1
      DarkViolet#9400D3
      DeepPink#FF1493
      DeepSkyBlue#00BFFF
      DimGray / ~DimGrey#696969
      DodgerBlue#1E90FF
      FireBrick#B22222
      FloralWhite#FFFAF0
      ForestGreen#228B22
      Fuchsia / Magenta#FF00FF
      Gainsboro#DCDCDC
      GhostWhite#F8F8FF
      Gold#FFD700
      GoldenRod#DAA520
      Gray / Grey#808080
      Green#008000
      GreenYellow#ADFF2F
      HoneyDew#F0FFF0
      HotPink#FF69B4
      IndianRed#CD5C5C
      Indigo#4B0082
      Ivory#FFFFF0
      Khaki#F0E68C
      Lavender#E6E6FA
      LavenderBlush#FFF0F5
      LawnGreen#7CFC00
      LemonChiffon#FFFACD
      LightBlue#ADD8E6
      LightCoral#F08080
      LightCyan#E0FFFF
      LightGoldenRodYellow#FAFAD2
      LightGray / ~LightGrey#D3D3D3
      LightGreen#90EE90
      LightPink#FFB6C1
      LightSalmon#FFA07A
      LightSeaGreen#20B2AA
      LightSkyBlue#87CEFA
      LightSlateGray / ~LightSlateGrey#778899
      LightSteelBlue#B0C4DE
      LightYellow#FFFFE0
      Lime#00FF00
      LimeGreen#32CD32
      Linen#FAF0E6
      Magenta / Fuchsia#FF00FF
      Maroon#800000
      MediumAquaMarine#66CDAA
      MediumBlue#0000CD
      MediumOrchid#BA55D3
      MediumPurple#9370DB
      MediumSeaGreen#3CB371
      MediumSlateBlue#7B68EE
      MediumSpringGreen#00FA9A
      MediumTurquoise#48D1CC
      MediumVioletRed#C71585
      MidnightBlue#191970
      MintCream#F5FFFA
      MistyRose#FFE4E1
      Moccasin#FFE4B5
      NavajoWhite#FFDEAD
      Navy#000080
      OldLace#FDF5E6
      Olive#808000
      OliveDrab#6B8E23
      Orange#FFA500
      OrangeRed#FF4500
      Orchid#DA70D6
      PaleGoldenRod#EEE8AA
      PaleGreen#98FB98
      PaleTurquoise#AFEEEE
      PaleVioletRed#DB7093
      PapayaWhip#FFEFD5
      PeachPuff#FFDAB9
      Peru#CD853F
      Pink#FFC0CB
      Plum#DDA0DD
      PowderBlue#B0E0E6
      Purple#800080
      RebeccaPurple#663399
      Red#FF0000
      RosyBrown#BC8F8F
      RoyalBlue#4169E1
      SaddleBrown#8B4513
      Salmon#FA8072
      SandyBrown#F4A460
      SeaGreen#2E8B57
      SeaShell#FFF5EE
      Sienna#A0522D
      Silver#C0C0C0
      SkyBlue#87CEEB
      SlateBlue#6A5ACD
      SlateGray / ~SlateGrey#708090
      Snow#FFFAFA
      SpringGreen#00FF7F
      SteelBlue#4682B4
      Tan#D2B48C
      Teal#008080
      Thistle#D8BFD8
      Tomato#FF6347
      Turquoise#40E0D0
      Violet#EE82EE
      Wheat#F5DEB3
      White#FFFFFF
      WhiteSmoke#F5F5F5
      Yellow#FFFF00
      YellowGreen#9ACD32

      Combo Search: Standard and Filter Search

      Mohammad11th April 2021 at 6:01pm
      exmp103 solution
      Idea
      have a searchbox which lets you to perform both standard search (only in title, caption, text) and filter search
      Use case
      one searchbox and do both standard and filter search

      Code

      Example

      Comma Separated List of Tiddlers

      Mohammad11th April 2021 at 6:01pm
      last operator solution

      There are several tiddlers named as demo/exmp027/title . Use $list widget and create a list of comma separated titles with links.

      Remarks

      • The butlast operator, selects all tiddlers and leave the last one unselected.
      • The last operator, selects the last item in the list
      • The result are shown with no prefix demo/exmp027/
      • Note to the comma , in the first $list. The reason for using two $list widgets here is to create a comma separated list of title. There is no comma after the last item.
      • Tiddlers belong to this demo are tagged with exmp027

      Compare Texts of Two Tiddlers

      Mohammad17th April 2021 at 10:31pm
      done solution task
      \define is-Tiddlers-text-equal(TidA, TidB)
      <$set name="tidAText" value={{{ [[$TidA$]get[text]] }}}>
      <$set name="tidBText" value={{{ [[$TidB$]get[text]] }}}>
      <$reveal type="match" default=<<tidAText>> text=<<tidBText>>>Equal</$reveal>
      <$reveal type="nomatch" default=<<tidAText>> text=<<tidBText>>>NotEqual</$reveal>
      </$set>
      </$set>
      \end

      Compare Variables for Equality and Inequality

      Mohammad11th April 2021 at 6:01pm
      reveal solution
      How to make a simply comparison between two variables or one variable and a fields content?
      The answer is using reveal widget.

      Simple reveal example

      Normally, the reveal widget is used to compare a "text" value with a value stored in the text field of a specified "state" tiddler, like this:

      <$reveal type="match" state="$:/state/SampleReveal1" text="show">
        show this if state tiddler content matches text param
      </$reveal>

      Use default attribute

      However, there is an alternative syntax that allows comparisons between any two values: while the "state" param can only use an implied reference to the "text" field of a specified tiddler, the "default" param can use ANY literal, field or variable reference. Simply OMIT the "state" param and use the "default" param in it's place, like this:

      <$reveal type="match" default={{sometiddler!!somefield}} text="show">
         show this if some field in some tiddler matches text param
      </$reveal>

      or

      <$reveal type="match" default=<<somevariable>> text="show">
         show this if somevariable matches text param
      </$reveal>

      Compare any two variables

      Since the "text" param also can use ANY field or variable reference, you can use reveal to compare any two variables, like this:

      <$reveal type="match" default=<<somevariable>> text=<<someOtherVariable>>>
         show this if somevariable value matches someOtherVariable
      </$reveal>

      Complex cases

      You can use any of the valid "type" values to make the comparison, including the recently added LT, GT, LTEQ and GTEQ types.

      For example, if you have some "task tiddlers" tagged with "todo" OR "done", you could display conditional output this way:

      <$set name="todo" filter="[tag[todo]count[]]">
      <$set name="done" filter="[tag[done]count[]]">
      <$reveal type="match"   default=<<todo>> text="0"> There is nothing to do. </$reveal>
      <$reveal type="nomatch" default=<<todo>> text="0">
         <$reveal type="match" default=<<done>> text="0">      You haven't started.                             </$reveal>
         <$reveal type="LT"    default=<<todo>> text=<<done>>> You're making progress... keep going!            </$reveal>
         <$reveal type="match" default=<<todo>> text=<<done>>> You're half way there... take a short break      </$reveal>
         <$reveal type="GT"    default=<<todo>> text=<<done>>> You've done a lot... but there's still some left </$reveal>
      </$reveal>
      </$set>
      </$set>

      Compose and Send Emails from a Tiddler

      Mohammad11th April 2021 at 6:01pm
      solution

      Concatenate Different Tiddlers in one Tiddler

      Mohammad11th April 2021 at 6:01pm
      solution

      Stefan Pfister a fiction story writer asked how can I create a long big fixed version of narration by concatenating the text of all related tiddlers? The purpose is to have a final pdf or raw text to be exported to some publication / layout software.

      1. First, we need some wiki syntax for generating the desired output. Something like this:

        <$list filter="[tag[About]]"><$text text={{!!text}}/></$list>
      2. Next, we can capture that output to a variable, using the <$wikify> widget:

        <$wikify name="out" text="""<$list filter="[tag[About]]"><$text text={{!!text}}/></$list>""">
           <<out>>
        </$wikify>
      3. Then, wrap that in a button so we can trigger an action to save the output to a tiddler instead of directly rendering the output:

        <$button> CLICK ME
           <$wikify name="out" text="""<$list filter="[tag[About]]"><$text text={{!!text}}/></$list>""">
              <$action-setfield $tiddler="JoinedOutput" text=<<out>> />
           </$wikify>
        </$button>
      4. Finally, for convenient re-use, wrap the entire button in a macro definition, and replace the literal values with macro parameter references.

        \define join(label,tag,target)
        <$button> $label$
           <$wikify name="out" text="""<$list filter="[tag[$tag$]]"><$text text={{!!text}}/></$list>""">
              <$action-setfield $tiddler="$target$" text=<<out>> />
           </$wikify>
        </$button>
        \end

        and call it like below

        <<join "CLICK ME" "About" "JoinedOutput">>

      Concatenate the Contents of Different Tiddlers

      Mohammad11th April 2021 at 6:01pm
      solution
      How to hardcopy the contents of several tiddlers in one tiddler?

      Sometimes it is rquired to concatenate the contents of several tiddlers into one anothere tiddler to get the final fixed form of contents. The below is one solution is given by Eric Shulman.

      1. First, we need some wiki syntax for generating the desired output. Something like this:

        <$list filter="[tag[About]]"><$text text={{!!text}}/></$list>
      2. Next, we can 'capture' that output to a variable, using the <$wikify> widget:

        <$wikify name="out" text="""<$list filter="[tag[About]]"><$text text={{!!text}}/></$list>""">
           <<out>>
        </$wikify>
      3. Then, wrap that in a button so we can trigger an action to save the output to a tiddler instead of directly rendering the output:

        <$button> CLICK ME
           <$wikify name="out" text="""<$list filter="[tag[About]]"><$text text={{!!text}}/></$list>""">
              <$action-setfield $tiddler="JoinedOutput" text=<<out>> />
           </$wikify>
        </$button>
      4. Finally, for convenient re-use, wrap the entire button in a macro definition, and replace the literal values with macro parameter references

        \define join(label,tag,target)
        <$button> $label$
           <$wikify name="out" text="""<$list filter="[tag[$tag$]]"><$text text={{!!text}}/></$list>""">
              <$action-setfield $tiddler="$target$" text=<<out>> />
           </$wikify>
        </$button>
        \end
        
        <<join "CLICK ME" "About" "JoinedOutput">>

      See also

      Concatenating Text to Make Dynamic URLs

      Mohammad11th April 2021 at 6:01pm
      concatenate solution

      There are some methods by Jed Carty explain ho to concatenate. One example is below. MOre example can be found in the address above.

      \define getAddress()
      http://www.principiadiscordia.com/book/$(page)$.php
      \end
      
      <$select field='test_field'>
      <$list filter="1 2 3 4 5 6 7 8 9 10 45 81">
      <option><<currentTiddler>></option>
      </$list>
      </$select>
      
      <$set name=page value={{!!test_field}}>
      <a href=<<getAddress>> target="_blank">go to page {{!!test_field}}</a>
      </$set>

      More on concatenation:

      1. Tiddlywiki

      Conditional Output

      Mohammad11th April 2021 at 6:01pm
      solution

      The content of the <$view> widget is displayed if the field or property is missing or empty.

      For example, see the below example. If the caption field is missing or empty, then the title will be shown if not, the caption will be shown.

      Remarks

      There are two widgets in TW which act the same way, e.g.

      • view widget
      • transclude widget

      The content inside of the <$view> or <$transclude> widget is displayed if the field or property is missing or empty.

      For more information see Mario note.

      Conditionally Display The Tiddler Contents

      Mohammad11th April 2021 at 6:01pm
      exmp016 solution viewtemplate
      How display conditionally the content of any tiddler tagged with erlang_code as a code with a compile button?
      A conditional viewtemplate, a stylesheet is needed as described below
      1. Create a tiddler tagged with $:/tags/Viewtemplate contains what is planned to be displayed conditionally, here it is planned to show a button and its text as a code.

        <$list filter="[is[current]tag[erlang_code]]">
        <button>Compile</button>
        <pre>{{!!text}}</pre>
        </$list>
      2. Here there is a problem. It is that the custom ViewTemplate doesn't replace the standard view... it ADDS to it to the end of the standard view. Thus, you see the tiddler content twice: first as standard wikitext output (the normal tiddler display) then followed by your custom-formatted output.

        To get the results you want, you need to suppress the standard output... but only when the tiddler is tagged "erlang_code".

        One quick way to achieve this is to use CSS to hide the standard tiddler "body" element. Just put the following CSS into a tiddler tagged with $:/tags/Stylesheet:

        [data-tags*="erlang_code"] .tc-tiddler-body { display:none; }
      3. Now create any tiddler you want and tag it with erlang_code and see the result. An example is given here.

        Consolitate the Current Story to Default

        Mohammad11th April 2021 at 6:01pm
        solution

        How to consolitate the current story to default?

        the below button makes all the open tiddlers in story river as defult tiddlers.

        <$set name="myStory" filter="[list[$:/StoryList]!tag[excludeStory]] -[[$:/core/ui/ControlPanel]]">
        <$button tooltip="set the default tiddlers to the current story">{{$:/core/images/save-button}} Story to Default
        <$action-setfield $tiddler="$:/DefaultTiddlers" $value=<<myStory>>/>
        </$button>
        </$set>

        Copy Result of Wikitext to clipboard

        Mohammad11th April 2021 at 6:01pm
        solution
        How to copy the result of wikified text into clipboard?
        Here's one way to do it. It's a classic application of the wikify widget: we need access to the wikified text of a tiddler, rather than its raw text.

        Solution

        The below macro to copy the wikified text of HelloThere tiddler to clipboard.

        Example

        The below button uses the above macro to copy the wikified text of HelloThere

        <$button actions=<<actions>> >
        Copy to clipboard
        </$button>

        Remarks

        Note how the actions are placed in a separate action string to avoid having to do the wikification until it is required (if it was within the button widget then the wikify widget would be re-evaluated each time the store changes).

        Count items within a Field

        Mohammad11th April 2021 at 6:01pm
        exmp049 solution
        How to count items in a tiddler field?
        Use the count widget and list operator

        Example

        Count the number of phrases (words) in the field of keywords of tiddlers tagged with solution. Show the results for the first five tiddlers

        Remarks

        • The list widget with tag[soloution] filter finds tiddlers tagged with solution
        • The limit[5] only shows the output for first 5 tiddlers tagged with solution
        • The count widget counts the number of items in the keywords field of current tiddler using the list operator (list[!!keywords])
        • The output is displayed as link to each tiddler with the number of items.
        • Note that if there is duplicate items, count considers them as one. See dominant append

        More information

        Create a Borderless Table

        Mohammad11th April 2021 at 6:01pm
        solution
        How create a borderless table?

        Create a tiddler tagged with $:/tags/Stylesheet and put the below css code inside it.

        .borderless,
        .borderless table,
        .borderless td,
        .borderless tr,
        .borderless th,
        .borderless tbody
            { border:0 !important; }
        }

        Then create your borderless table using the above class like below

        @@.borderless
        |a|b|
        |c|d|
        @@

        Example

        The below code shows a sample borderless

        Create a Doubly Sorted Table

        Mohammad11th April 2021 at 6:01pm
        exmp057 solution
        How to create a table from a list of tiddlers which is sorted first by value of field 1 and then sort the rsult by value of field 2?
        This is called a doubly sorted list and can be done using a nested $list widget

        Example

        Assume there is a list of tiddlers contain the biblography data of some ebooks as below

        • tiddler title: ebook title
        • vendor field: publisher name
        • author field: ebook author name

        Create a table contains ebook data sorted first in vendor name and second in author name.

        <table>
        <$list filter="[tag[ebook]has[vendor]each[vendor]get[vendor]sort[]]" variable="publisherName">
        <$list filter="[tag[ebook]has[vendor]field:vendor<publisherName>sort[author]]" variable="bookName">
        <tr>
          <td>
            <$link to={{!!title}}><$view tiddler=<<bookName>> field="title"/></$link>
          </td>
          <td>
            <$view tiddler=<<bookName>> field='author'/>
          </td>
          <td>
            <$view tiddler=<<bookName>> field='vendor'/>
          </td>
        </tr>
        </$list>
        </$list>
        </table>

        Remarks

        The first $list filter:

        • Gets a list of all my books (tagged ebook)
        • Looks at the vendor field and gets a list of vendors using the get operator
          • Since the get operator is one of the few operators that allow duplicates, it is possible to have the same vendor listed multiple times in the list created
        • So first use the each operator to ensure unique items (vendors).
        • Then this list of all vendors is sorted by the vendor's name

        The second $list filter will then runs for every vendor in the list created by the first $list

        • For the first item - which is the first vendor's name
          • It first gets a list of all the books (tagged ebook)
          • Then looks at the vendor field - selects the ones that match this first vendor
          • Then sorts those by the author field
        • Then it does that for the 2nd author in the list provided by the first $list filter
        • . . . and so on for all the vendors one by one as provided by the first $list filter.

        More info

        See Example 57: Doubly Sorted Table

        Also see List by Tag but Sort and Show by Field Value

        Create a List of Numbers

        Mohammad11th April 2021 at 6:01pm
        exmp102 solution

        Three solution has been provided

        Diego Mesa:uUsing Evan's forumla range

        If you dont want the full formula plugin, you can also just use Evan' range operator directly: http://evanbalster.com/tiddlywiki/formulas.html#%24%3A%2Fplugins%2Febalster%2Fformula%2Ffilters%2Frange.js

        Jed Carty numb macro using list

        title: $:/macro/numb
        tags: $:/tags/Macro
        list: 0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30
        
        \define numb(n:10 format:"<<currentTiddler>> ") <$list filter='[enlist{$:/macro/numb!!list}first[$n$]]'>$format$</$list>

        BTC solution using list

        • Use the Evan's formula plugin

        This feature has been included in TW 5.1.18 core.

        <$list filter="[range[99]]">
        do something
        </$list>
        • Use the list widget with a tiddler containing a list of numbers
        <$list filter="[list[mynumbertiddler]limit[mylimit]]">
        do something
        </$list>

        The examples and codes by this methods are given in:

          Create a New Tiddler Using Input Box

          Mohammad11th April 2021 at 6:01pm
          solution
          How create a new tiddler, with the following specification?
          1. Its full title is $:/long/address/to/tiddler/UserInput
          2. The last part of title e.g. UserInput is given through an input box (edit-text widget)
          3. The caption is the same as UserInput

          Solution

          Remarks

          1. An $edit-text widget gets the user input and puts it in a temporary tiddler $:/temp/getname.
          2. The $wikify widget is used to combine static text with the value from the temporary tiddler (concatenate).
          3. The value of the resulting target variable is used as the $param for the new tiddler title.
          4. The value from the temporary tiddler is also used as the caption text for the new tiddler.

          Create a Simple Comment Button

          Mohammad11th April 2021 at 6:01pm
          solution
          What is the simplest solution to have a button creates a comment tiddler for current tiddler?
          Using action-create widget and action-navigate widget, it is possibe to do that.

          Solution

          <$button> Click to make a comment
            <$action-createtiddler 
             $basetitle="comment"
             $savetitle="$:/temp/commentName"
             relationship="comment" 
             parent=<<currentTiddler>>
            /> 
            <$action-navigate 
             $to= {{$:/temp/commentName}}
            />
          </$button>

          Alternative solution

          A revised version of above code is given below in that the actions are encapsulated in a macro and the title of parent tiddler is added to title of comment tiddler.

          \define mytitle() comment on {{!!title}}
          
          \define create-commentTid()
          <$wikify name="ctitle" text=<<mytitle>> >
          <$action-createtiddler 
           $basetitle=<<ctitle>>
           $savetitle="$:/temp/commentName"
           relationship="comment" 
           parent=<<currentTiddler>> 
          /> 
          <$action-navigate 
           $to= {{$:/temp/commentName}} 
          />
          </$wikify>
          \end
          
          <$button actions=<<create-commentTid>> >
          Click to make a comment 
          </$button>

          Create a Tiddler if not Existed

          Mohammad11th April 2021 at 6:01pm
          solution

          A working version

          \define create-note(tname)
            <$set name="myTid" filter="[[$tname$]addsuffix[-math]]" select=0>
              <$list filter="[title<myTid>] +[has[title]]" 
                  variable="newTid" 
                  emptyMessage=<<tiddler-not-exist>>
              >
                  <$action-navigate $to=<<newTid>> />
              </$list>
            </$set>
          \end
          \define tiddler-not-exist()
            <$action-setfield 
              $tiddler=<<myTid>>
              text="Hi, this is a new note"
              tags="notes"
            />
              <$action-navigate $to=<<myTid>>/>
          \end
          
          <$button>
          Test
          <<create-note "Bob Joe">>
          </$button>

          Notes

          what I changed:

          • A typo in the emptyMessage macrocall
          • replace {{{myTid}}} with <<myTid>> and add select=0 to the set widget to prevent it from adding [[ and ]] around the output. Using {{{$(myTid)$}}} evaluates it as a space separated list so any title with a space would be two (or more) separate things, not a single title.
          • remove parent as an input to tiddler-not-exist and remote the unneeded input from the emptyMessage macrocall because it isn't used
          • Alternate solution

          Alternately, this could have fixed it: * Using """$(myTid)$""" to make a string instead of {{{$(myTid)$}}} to evaluate a filter. This is one place that would break if you had a space, {{{bob joe}}} is returned as a list with two entries, "bob" and "joe" where """bob joe""" is a string and can be used as a single title. I am using """ because that lets you put " and ' into the title if you want to for some reason and (hopefully) """ is less common in titles.

          Create External Images from A Directory

          Mohammad11th April 2021 at 6:01pm
          image solution
          Assume you have a folder on Windows drive contains images, how to add these images to wiki as external images?

          Using an advanced text editor like Emacs, get a list of your images and put it into a format like this:

          cimg2199.jpg: x
          cimg2200.jpg: x
          cimg2201.jpg: x
          cimg2202.jpg: x

          Paste this into a tiddler called "MyImages" and change the type to data dictionary. Save the tiddler.

          Create another tiddler with the following contents:

          \define gluepath() $(path)$$(image)$
          <$set name="path" value="file:///D:\data\graphics\file-us\">
          
          <$button>Make Image Tiddlers
          <$list filter="[[MyImages]indexes[]]" variable="image">
          <$action-createtiddler $basetitle=<<image>> _canonical_uri=<<gluepath>> type="image/jpeg">
          </$list>
          </$button>
          
          </$set>

          Change the "path" variable to whatever address is needed for image directory and system (I used file:/// but you don't need that for images positioned relative to your system).

          Click on the "Make Image Tiddlers" button, and a "Image Tiddler" (_canonical_uri based) will be made for each image.

          You can of course play with this to use other image dictionaries, paths, etc. A similar technque could be used to generate image wikitext if you don't like Image Tiddlers. Note that if you are on windows that you can't use drive names like C: in the data dictionary (that's why I applied the path outside the dictionary).

          Example

          See TW-Images there are examples there using this technique

          Create New Tiddler and TextReference in Tags

          Mohammad11th April 2021 at 6:01pm
          button solution

          How to use tm-new-tiddler and have more than one tag, some are text reference? : Whenever you need to concatenate strings (as you do with the tags) you almost always need to use a macro.

          \define mybutton(param) 
          <$button>
          New Tiddler
          
          <$action-sendmessage $message="tm-new-tiddler"
              title="Title"
              text="some text..."
          
              tags="slide [[$param$]]"
          />
          </$button>
          \end

          Create New Tiddler with a Link to Current in the Text

          Mohammad11th April 2021 at 6:01pm
          exmp113 solution
          How to create a new tiddler from within the current tiddler that puts the the parent tiddler's title in the text of the child tiddler?

          Solution

          Whitin any tiddler, the variable currentTiddler refers to itself, so the below code simply does the job.

          Remarks
          The $button widget creates a button on click triggers the action
          The action-sendmessage sends the tm-new-tiddler to create a new tiddler and open it for edit
          The title parameter sets the title of new tiddler to current date with a format like 28th January 2020
          The text parameter puts a link to the parent tiddler
          Note: the [[...]] creates a wikilink and the $(currentTiddler)$ renders as the title of current tiddler in the macro

          See exmp113/macro/createTid for example.

          Create New Tiddler with Content

          Mohammad11th April 2021 at 6:01pm
          solution task

          Create Persistent Tag with Color

          Mohammad11th April 2021 at 6:01pm
          solution
          How create persistent colorful tags?
          When all tiddlers tagged say with myTag which can also have a color deleted, the colorful myTag will not be available. To have a persistent tag create their tiddler separately.

          Example

          Create a tag with green color for css

          • Create a tiddler, with title css
          • Add a field with title color
          • Click the color picker in front of color field and select the green color
          • Save the tiddler

          That's all. Now the css will be available and will not removed automatically even all tiddlers tagged with css deleted.

          Create Svg Icons Using Macro

          Mohammad11th April 2021 at 6:01pm
          exmp061 solution

          The below macro was developed by Silverfox for the great Archipel wiki, in a that D3JS is used for visualization Tiddlywiki contents.

          Macro pastille

          The pastille macro creates small macro and gets its fill color from input tiddler

          \define pastille(tagName)
          <svg width="14" height="14" >
          <circle cx="7" cy="7" r="6" stroke="grey"  fill={{$tagName$!!color}}/>
          </svg>
          \end

          Example

          There is several examples on http://archipel.tiddlyspot.com/#Knowledge%20map%20options. One example has given here Example 61: Pastille Macro

          Create Tiddler with Sequence Number

          Mohammad11th April 2021 at 6:01pm
          exmp050 solution

          Double check, seems does not work!

          Assume you want to create tiddlers all tagged with say myTag and have unique title with ordinal number. So

          • tiddlers have title like myTiddler-1
          • tiddlers all tagged with myTag
          \define newTitle() myTiddler-{{{[tag[myTag]count[]add[1]]}}} 
          \define newTiddler()
          <$wikify name="myTitle" text="<<newTitle>>" >
          <$action-createtiddler $basetitle=<<myTitle>> tags="myTag" /> 
          </$wikify>
          \end

          Then use it like below

          <$button actions=<<newTiddler>>>
          Create a new tiddler
          </$button>

          Remarks

          • The wikify widget, calls newTitle macro, creates a new title using filter transclusion and store it in myTitle variable.
          • The action-createtiddler creates a new tiddler using myTitle and myTag.

          Issues and solution

          Thomas Elmiger states that if some tiddlers deleted in this between, the above code may overwrite the previous ones. Assume you have myTiddler-1, myTiddler-2, and myTiddler-3. Now you delete myTiddler-2 abd then create another, the current code sees there is two tiddler, so it creates the next and overwrite myTiddler-3.

          Solution

          • If myTiddler-2 deleted, the code will create myTiddler-3 1. So there is no risk to overwrite
          • To overcome this issue, the below recursive macro take cares of this issue as below
          \define newTitle() myTiddler-{{{[tag[myTag]count[]add[$(inc)$]]}}} 
          
          \define newTiddler(n:0)
          <$set name="inc" value={{{ [<__n__>add[1]] }}}>
          <$wikify name="myTitle" text="<<newTitle>>" >
          <$list filter="[<myTitle>] +[!has[title]]" 
          emptyMessage=""" <$macrocall $name="newTiddler" n=<<inc>> /> """>
          <$action-createtiddler $basetitle=<<myTitle>> tags="myTag" />
          </$list>
          </$wikify>
          </$set>
          \end
          
          <$button actions=<<newTiddler>>>
          Create a new tiddler
          </$button>

          Remarks

          • The newTiddler macro check if the tiddler is going to created is existed or not. It uses the list widget for this purpose.
          • If the tiddler is existed, it calls itself with n icremented by one. This is done by emptyMessage part of list widget.
          • The newTiddler macro calls itself as many as time to find a sequence number not in use and then creates the tiddler.

          Solution iii

          Mal has proposed using zero padded number. A revised version of zero padded number (assuming 3 digits) is given below.

          \define newTitle() myTiddler-{{{[tag[myTag]count[]add[1]addprefix[0000]split[]last[3]join[]]}}} 
          \define newTiddler()
          <$wikify name="myTitle" text="<<newTitle>>" >
          <$action-createtiddler $basetitle=<<myTitle>> tags="myTag" /> 
          </$wikify>
          \end

          See this method in action: Example 50: Tiddler Title with Zero Padded Number.

          Create Tiddler with Title and Time

          Mohammad11th April 2021 at 6:01pm
          solution

          Given a tiddler called "Tiddler X", how to include a button it that to create a new tiddler called "Tiddler X: and the current date time"

          • Create a macro to do the job
          \define newTid(param:"", btn-caption:"New project", color:"#8058A5") 
          <$button style="color:$color$; fill:$color$; margin-bottom:5px;">
          {{$:/core/images/new-button}} $btn-caption$
          
          <$wikify name="newTitle" text="""{{!!title}}: <<now "YYYY-0MM-0DD hh12:0mmpm">>""">
          <$action-sendmessage $message="tm-new-tiddler"
              title=<<newTitle>>
              text="..."
              tags="[[$param$]]"
          />
          </$wikify>
          </$button>
          \end
          • Example
          <<newTid param:"$(currentTiddler)$">>

          Here macro is called by text substitution e.g $(currentTiddler)$

          <$macrocall $name="newTid" param=<<currentTiddler>> />

          CreateTiddler

          21st April 2021 at 10:41pm
          MyOwn

          Creating a splash screen

          21st April 2021 at 6:58pm
          FromTiddlerWiki

          默认情况下,TiddlyWiki 在加载时,显示空白画面。如果您愿意,可以在维基加载时,增加一个特殊的 "启动画面"。

          为了在 TiddlyWiki 初始化之前,显示启动画面,它将当作静态 HTML/CSS 嵌入到 TiddlyWiki HTML 文件中。这是通过 SystemTag: $:/tags/RawMarkupWikified/TopBody 完成的。

          另一个在维基完成加载时,删除启动画面,HTML 应该包含在一个带有特殊类 tc-remove-when-wiki-loaded 的容器中。一旦维基加载,核心将自动删除具有此类的任何 DOM 元素。

          这是一个简单的启动画面示例,只显示文本 加载中...。要使用它,将文本复制到一个新的条目,设其类型 text/plain 和标签 $:/tags/RawMarkupWikified/TopBody

          <div class="tc-remove-when-wiki-loaded">
          加载中...
          </div>

          如果条目被赋予维基文本类型 text/vnd.tiddlywiki ,那么在保存文件时,维基化内容,允许进行转换等。例如,这是一个在加载消息中,引用网站标题的示例。要使用它,将文本复制到一个新的条目,设其类型 text/vnd.tiddlywiki 和标签 $:/tags/RawMarkupWikified/TopBody

          \rules only filteredtranscludeinline transcludeinline
          <div class="tc-remove-when-wiki-loaded">
           {{$:/SiteTitle}}  加载中,请稍候
          </div>

          \rules 指令用于限制被识别为两种内联转换形式的维基文本语法。这避免了对条目内容的意外破坏。

          使用 CSS 动画和在此维基中配置的图像,有一个更复杂的示例启动画面:请参阅 $:/SplashScreen

          CSS

          21st April 2021 at 9:56pm
          Web

          CSS and Blockquote

          Mohammad11th April 2021 at 6:01pm
          solution

          Ever tried. Ever failed. No matter.
          Try again. Fail again. Fail better.

          Samuel Beckett

          CSS and List Style Color

          Mohammad11th April 2021 at 6:01pm
          solution
          How to change the color and fonts of bullets and number in list?
          Use ::marker pseudo element if browser support or use the below method

          More info:

          CSS for Background Color of Tiddler Title

          Mohammad11th April 2021 at 6:01pm
          solution

          How to change the background color of tiddler title?

          • Create a new tiddler tagged with $:/tags/Stylesheet
          • Put the below css inside (yellow color used as an example)
          .tc-title {
            background: yellow;
          }

          The above css uses yellow backgroud. You can change other properties of tc-title.

          How to change the background color of non-system tiddler title only?

          System tiddlers (prefixed $:/) do have a class definition on the "tiddler" level. ... tc-tiddler-system

          So if you style tc-title for every tiddler, you can reset it back for system tiddlers with the code above, using CSS hirarchy.

          • Create a new tiddler tagged with $:/tags/Stylesheet
          • Put the below css inside it
          .tc-title {
            background: yellow;
          }
          
          .tc-tiddler-system .tc-title {
            background: initial;
          }

          How to change the color of prefix of system tiddler title?

          The prefix of system tiddlers ($:/) do have a class definition as ... tc-system-title-prefix. So to change their style do as below

           .tc-system-title-prefix {
              color: blue;
          }

          The above css uses blue color. You can change other properties of tc-title.

          CSS for Last Char of Title

          Mohammad11th April 2021 at 6:01pm
          exmp010 solution

          How to set a text after tiddler title tagged with say period?

          For example add word experimental to all tiddlers tagged with period.

          • Solution

          The belwo css uses the after selector. Put it in a tiddler tagged with $:/tags/Stylesheet and use it. See demo.

          [data-tags*="period"] .tc-title:after {
            content:"experimental";
            color:red;
          }

          CSS inside Macro

          Mohammad11th April 2021 at 6:01pm
          solution
          Is it valid to have css inside macro, if so which of the two below solution is recommended?
          1. Define inline style

            \define vspace(height)
            <style>
              .vertical-space {
                 margin-bottom: $height$;
              }
            </style>
            <p class="vertical-space"></p>
            \end
          2. Define inline style

            \define vspace(height)
            <p style="margin-bottom: $height$;"></p>
            \end

          Custom Filter in Advanced Search

          Mohammad11th April 2021 at 6:01pm
          solution

          To add your own filters to the list of advanced search filters (drop down menu):

          1. create a new tiddler (e.g. SomeName) tagged with $:/tags/Filter
          2. add a description field containing "My Filter")
          3. add a filter field containing [search:text[MYSEARCHTEXT]])
          4. add a list-before field (leave it with a blank value)
          • the tag indicates that this is an entry for the filter drop-down.
          • the description is the text that appears in the drop-down.
          • the filter is the text to insert into the filter input field when the drop-down item is selected
          • the list-before field (with NO value) forces your custom filter to * the top of the list (otherwise it would be at the end of the list)

          Custom Style and Classes in Wikitext

          Mohammad11th April 2021 at 6:01pm
          solution

          The above code is, of course, standard HTML with "inline CSS". To use actual TiddlyWiki syntax, you would write:

          @@display:none;
          This is hidden text
          @@

          Basically, the @@... @@ is TiddlyWiki's way of defining a "div" (or a "span") that wraps around a section of content, just like the <div>...</div> HTML syntax. The text immediately following the opening @@ and ending with a semi-colon ; is standard CSS syntax. If, for example, you didn't want to hide the text, but rather, show it with some styling applied, you could write something like:

          @@color:red;
          This is some warning text.  PAY ATTENTION!
          @@

          You can also string together a sequence of CSS attributes, like this:

          @@color:red;font-size:400%;border:1px solid red;
          WARNING!  DANGER WILL ROBINSON!
          @@

          As noted above, this is equivalent to

          <div style="color:red;font-size:400%;border:1px solid red;">
          WARNING!  DANGER WILL ROBINSON!
          </div>

          However, the <div> syntax always creates content on a line by itself. If you want to do the same styles, but have the content appear "inline", you would use a <span>...</span> in place of the <div>...</div>, like this:

          Then, the Robot said, <span style="color:red;font-size:400%;border:1px solid red;">WARNING! DANGER WILL ROBINSON!</span> as it flailed it's tubular arms wildly.

          and, in TiddlyWiki syntax, this would be written as:

          Then, the Robot said, @@color:red;font-size:400%;border:1px solid red; WARNING! DANGER WILL ROBINSON!@@ as it flailed it's tubular arms wildly.

          You can find many excellent CSS technical references online. For example, Mozilla (a browser developer), offers this reference for the CSS "border" syntax:

          https://developer.mozilla.org/en-US/docs/Web/CSS/border

          You can use that site (and others like it) to look up lots of CSS goodies that you can then incorporate into your content, using either HTML or TiddlyWiki "wrappers".

          More information on styles and classes in wikitext is available at:https://tiddlywiki.com/#Styles%20and%20Classes%20in%20WikiText

          Customize Look of Editor 5.1.18

          Mohammad11th April 2021 at 6:01pm
          solution

          The editor and preview pan in TW 5.1.18 get new look and feel like rounded corner and shaded color. The below code shows how customize and keep the 5.1.17 setting

          • Removing the box-shadow from the editor is just
          .tc-tiddler-frame.tc-tiddler-edit-frame iframe.tc-edit-texteditor {
          box-shadow: none;
          }
          • To remove the border-radius:
          border-radius: none;
          • To remove it from the preview:
          .tc-tiddler-preview-preview {
          border-radius: none;
          }

          Customize Tagpill Using CSS

          Mohammad11th April 2021 at 6:01pm
          solution
          How change the look and feel of tagpills?
          Use proper stylesheet

          The below sample shows how to customize the tagpill. To use it

          • create a new tiddler
          • tag it with $:/tags/Stylesheet
          • put the below css as its text field
          • save
          /*TAG EDITOR AND DROPDOWNS*/
          
          html body.tc-body .tc-block-dropdown-wrapper {width:800px;color:#2200bb;}
          html body.tc-body .tc-block-dropdown {width:800px;white-space:normal;color:#2200bb;}
          html body.tc-body .tc-block-dropdown a {display: inline-block;color:#2200bb;}
          html body.tc-body .tc-block-dropdown svg {height: 1.2em;fill:#ccc;display:inline;color:#2200bb;}
          
          /*TAG LABELS*/
          
          html body.tc-body .tc-tag-label {font-family: 'Arial'; font-size:10pt; color:#2200bb;background-color:#eee;margin-bottom:6px;font-weight: bold;}
          html body.tc-body .tc-menu-list-item {font-weight: bold; color:#2200bb;}

          Customize the Buttons on Editor Toolbar

          Mohammad11th April 2021 at 6:01pm
          solution
          How to customize the buttons on editor toolbar?
          Target the tc-editor-toolbar element and customize it using CSS

          Example

          Change the color to crimson and backgrounds to lightgrey of all button on editor toolbar. Use cyan for button on hover.

          Remarks

          If you want to customize specific button like H1 do as below

          .tc-editor-toolbar .tc-image-heading-1 {
            background: blue;
            fill: red;
          }
          .tc-editor-toolbar .tc-image-heading-1:hover {
            background: green;
            fill: yellow;
          }
          Note that .tc-image-heading-1 is selector for H1 button.

          See Change the Colors of One Editor Toolbar Button for more information.

          Customized Numbered Lists

          Mohammad11th April 2021 at 6:01pm
          solution
          How to set typed list attribute?
          Use css

          If you want to set things globally just create a new stylesheet tiddler with this content and tagged with $:/tags/Stylesheet

          ol li { list-style-type:upper-alpha; }
          ol li li  { list-style-type:lower-alpha; }
          ol li li li { list-style-type:upper-roman; }
          

          Using with ordered lists

          # One
          ## One-one
          ## One-two
          # Tow
          ## Two-one
          ### Two-one-one
          ### Two-one-two
          # Three

          Will create

          A. One
            a. One-one
            b. One-two
          B. Tow
            a. Two-one
              I.Two-one-one
             II.Two-one-two
          C. Three
          

          No extra chars needed. Especially if you need to change something later, you don't need to think about it, which class to use

          More information

          CXO行业四家优质企业

          11th April 2021 at 6:01pm
          stock
          昭衍新药
          美迪西
          凯莱英
          泰格医药

          Dashes in WikiText

          22nd April 2021 at 6:56am
          WikiText

          You can create an n-dash with a double hyphen -- and an m-dash with a triple hyphen ---. For example – this is an example — and so is this

          DataBase

          21st April 2021 at 10:01pm
          MyContents

          DataTiddler Terminology

          Mohammad11th April 2021 at 6:01pm
          datatiddler solution

          For the purposes of this style guide, we define the following terms:

          • property - a name/value pair inside a JSON object.
          • property name - the name (or key) portion of the property. It is called index in Tiddlywiki.
          • property value - the value portion of the property. It is called the value in Tiddlywiki.
          "propertyName": "propertyValue"

          DataTiddler Value Set to a Variable

          Mohammad11th April 2021 at 6:01pm
          datatiddler solution
          How to transclude a Value of a DataTiddler Using a Variable?

          A reference to a data dictionary index is enclosed in doubled curly braces as below

          value={{tiddlername##indexname}}

          Note: If the tiddlername portion of the reference is omitted, the reference is to an index in the currentTiddler

          <$set name="var1" value={{tiddlername##indexname}}>
             Here you have access to <<var1>>.
          </$set>

          See also Variable as DataTiddler Index for more information.

          Date Format in Tiddler Subtitle

          Mohammad11th April 2021 at 6:01pm
          solution

          Date in Custom Field

          Mohammad11th April 2021 at 6:01pm
          solution
          How to display the date stored in custom field with certain format?

          On the Tiddlywiki.com the tiddler: Date Fields tells us:

          To avoid problems arising from differences of time zone, TiddlyWiki always uses UTC.

          The tiddler: DateFormat tells us:

          [UTC] Time-shift the represented date to UTC. Must be at very start of format string.

          UTC is Coordinated Universal Time - so a time zone offset is needed for where you are. The extra 8 you used signifies HOURS. Instead this may work:

          Example

          You can use dieffenet date format as explained on Tiddlywiki.com.

          Definitions in WikiText

          22nd April 2021 at 6:56am
          WikiText

          HTML definition lists are created with this syntax:

          Defualt Tiddlers as a Blog

          Mohammad11th April 2021 at 6:01pm
          solution

          How to configure Default tiddlers to open all recent ordered by date like a blog?

          In the default tiddlers you can put:

          [days[-7]!is[system]sort[modified]]

          where -7 is how many days you want to appear (-7 means last 7 days).

          This is modified date, which changes whenever you update the tiddler. You can change it to created if you want, which is based on when the tiddler is created. The distinction might be important if you need to go back to blog entries and make corrections but don't want their order to change.

          Delete a List of Tiddlers

          Mohammad11th April 2021 at 6:01pm
          batch solution

          How to create a list of tiddlers tagged with say mytag having a delete button for each item? So, one can delete items optionally.

          Solution i

          Inspired by a similar solution By Mark S.

          List all tiddlers tagged with Concepts and dedicate a delete button to each item.

          <$list filter="[tag[Concepts]]">
          <$button message="tm-delete-tiddler"  >Delete</$button>
          <$text text= <<currentTiddler>> /><br/>
          </$list>

          Using Named Colors

          Solution ii

          Anthony Muscio proposed a simple solution here. It uses one button to delete all tiddlers at once.

          <$button>
          <$list filter="[tag[Concepts]]" variable=tiddlername>
          <$action-deletetiddler $tiddler=<<tiddlername>>/>
          </$list>
          Delete Set
          </$button>
          <$button>
          <$action-deletetiddler $filter="[tag[Concepts]]"/>
          Delete Set
          </$button>

          Solution iii

          Tobias Beer has given a solution inspired by posts from Stephan Hradek and Metabele to delete tiddlers using a filtered list... See it here tb5

          Delete Bulk of Tiddlers Selectively

          Mohammad11th April 2021 at 6:01pm
          solution
          How to delete several tiddlers selectively?
          Use a $list widget to display tiddlers and a $checkbox to let select them.

          Code

          <$list filter="[all[tiddlers]]">
             <$checkbox field="selected" checked="true" unchecked="false">
                <$link /><br>
             </$checkbox>
          </$list>
          <$button> delete selected tiddlers
             <$list filter="[all[tiddlers]selected[true]]">
                <$action-deletetiddler $tiddler=<<currentTiddler>> />
             </$list>
             <$list filter="[all[tiddlers]selected[false]]">
                <$action-deletefield $tiddler=<<currentTiddler>> $field="selected" />
             </$list>
          </$button>

          Remarks

          • the first filter lists all tiddlers, and shows a checkbox for each
          • the checkbox adds a field to the listed tiddler: selected=true/false
          • the button invokes $action-deletetiddler for each tiddler that has field selected="true"
          • the button also invokes $action-deletefield for each tiddler that has field selected="false"
          • this is in case you selected a tiddler and then changed your mind and deselected it

          Delete Tiddlers

          Mohammad11th April 2021 at 6:01pm
          batch solution
          How list and delete tiddlers as below?
          1. Create a list of tiddlers whose titles match some string (simple equality, or even better, regex)
          2. Delete them as a batch

          Solution

          Step i: list tiddlers

          The below code lists tiddlers their title starts with Formatting List. You can use other filter you like. It uses the TW rexexp operator.

          <$list filter="[!is[system]regexp[^Formatting List]]" variable="tidToDelete">
          <li> <<tidToDelete>> </li>
          </$list>

          Step ii: Use a button to delete all tiddlers

          Copy/paste the filter above into this button:

          <$button>
          Delete these tiddlers!
          <$list filter="PLACE_FILTER_HERE" variable="tidToDelete">
          <$action-deletetiddler $tiddler=<<tidToDelete>>/>
          </$list>
          </$button>

          See also

          Delete Tiddlers Based on a Field

          Mohammad11th April 2021 at 6:01pm
          field solution

          How develop a viewtemplate to show a red delete button on tiddlers have a due field?

          <$list filter="[is[current]has[due]]">
            <$button message="tm-delete-tiddler"  tooltip="delete tiddler" class="tc-btn-invisible">
          <span style=background-color:red; class=tc-tag-label>Delete</span>
            </$button>
          </$list>

          It shows a red button. On click it can delete the tiddler.

          Disable Dragability of an Element

          Mohammad11th April 2021 at 6:01pm
          solution

          There *is* a way to disable dragability of an element:

          The following CSS should disable dragging of all links:

          a {
             -moz-user-select: none;
             -webkit-user-select: none;
             -ms-user-select: none;
              user-select: none;
             -webkit-user-drag: none; user-drag: none;
             -webkit-touch-callout: none;
          }

          Note: to limit this to just certain links, change the above to:

          .nodrag a { ... }

          and then wrap the desired link(s) within .nodrag, like this:

          @@.nodrag [[SomeLink]]@@

          Disable Search Autofocus

          Mohammad11th April 2021 at 6:01pm
          solution

          Tiddlywiki by default has auofocus on Searchbox on the sidebar. This may cause annoying behaviour when you open a wiki and a search word in the sidebar search box. To disable this feature:

          1. Open $:/config/Search/AutoFocus
          2. Set the text value of this tiddler to false.

          Disable Timestamp

          Mohammad11th April 2021 at 6:01pm
          solution

          Display All Core Images in a Table

          Mohammad11th April 2021 at 6:01pm
          image solution
          How all core images can be listed?

          The core images tagged $:/tags/Image are actually shadow tiddlers. The "tag" macro looks for shadow tiddlers by default. The list-links macro will only look for shadow tiddlers if you provide an appropriate filter that includes them:

          <<list-links "[all[shadows+tiddlers]tag[$:/tags/Image]]">>

          Example

          List ten core images in a table with their title. The below example is given by Joe Armstrong.

          • You can remove the limit[10] operator to list all images
          • This is a dynamic table and the number of list widget outputs determine the number of rows

          Display Certain Level of Tag Tree

          Mohammad11th April 2021 at 6:01pm
          solution
          How to show a certain level of tag tree?
          Use tagging operator to select certaing level.
          level 1: <$list filter="[tag[$:/.mr/toc]]">
          
          </$list>
          
          level 2: <$list filter="[tag[$:/.mr/toc]tagging[]]">
          
          </$list>
          
          level 3: <$list filter="[tag[$:/.mr/toc]tagging[]tagging[]]">
          
          </$list>

          Display Custom Date Format

          Mohammad11th April 2021 at 6:01pm
          exmp084 solution
          The TW standard date format looks like YYYY0MM0DD, using the split operator of TW5.1.20 it is possible to handle YYYY-0MM-0DD and display results as Month day, year

          Example

          The below example exmp084/demo shows how dates like 2019-08-01 can be treated using the split operator.

          Remarks
          The date as 2019-08-01 is stored in field test-field
          The split[-] splits the entry on - delimiter
          The nth[?] operator select the first, second, or third part of result. For example nth[1] takes the first part
          The lest $set widget takes the nth entry based on month number. For example if month number is 3 then +[nth<mpos>] returns Mar

          Result

          Display Fields with Specific Prefix

          Mohammad11th April 2021 at 6:01pm
          exmp081 solution
          How to display fields that have a specific prefix in the current tiddler?
          for fetching fields and their values in current tiddler use $list widget and all[current]

          Example

          Example of fetching fields and values in current tiddler where field name starts with my :

          See exmp081/demo for details.

          Display Tagged Tiddlers Using ViewTemplate

          Mohammad11th April 2021 at 6:01pm
          $:/_site/tagging solution tagging
          How to display list of tiddlers tagged with parent tiddler, when it is opened?
          Use conditional view template.

          Example

          The below template shows all tiddlers tagged with the parent tiddler as an ordered list:

          • It checks to see if there is any tiddler tagged with the current tiddler (parent). This is performed by the outer list widget.
          • It then makes a call to list-links macro to display the tiddlers using an ordered list.
          • A short message is also showed indication tiddlers tagged with the parent tiddler.

          Source: viewtemplate/tagging

          DNS

          27th April 2021 at 11:23am
          Web

          DNS解析

          5th May 2021 at 4:36pm

          Draft of 'Git与GitHub'

          29th April 2021 at 4:02pm

          Draft of 'ssh-keygen'

          7th May 2021 at 9:15am

          Drag and Drop of a Whole File

          Mohammad11th April 2021 at 6:01pm
          import solution

          All tiddler links are draggable by default. They can be dragged within a browser window for manipulating tiddlers, or dragged to a different browser window to initiate an import operation

          If you drag-and-drop a whole wiki file (a Tiddlywiki file e.g. mywiki.html) over another wiki, an import operation will be inititaed

          This way you can also update old wiki files. Assume you have an empty.html of new release. If you drag and drop your old wiki file over the empty.html, TW will import all tiddlers except the newer system (core, plugin) tiddlers.

          Example

          1. Open an empty.html (can be downloaded from: https://tiddlywiki.com/#GettingStarted)
          2. Open it in a browser
          3. Drag your old wiki over it
          4. Choose which tiddlers you would like to be imported
          5. Save your empty.html

          That's all.

          Drag and Drop of Tag Pills

          Mohammad11th April 2021 at 6:01pm
          import solution

          Tag pills are draggable, and are equivalent to simultaneously dragging all of the individual tiddlers carrying the tag

          If you drag-n-drop a Tag pill between wikis (two Tiddlywiki files) ALL the tiddlers under that Tag can get imported.

          Example

          Try to drag the below tag to another wiki files. This will import all tiddlers tagged with coding to the new wiki.

          Thanks to Josiah

          Droppable Widget and Last Item in the List

          Mohammad11th April 2021 at 6:01pm
          solution

          Dynamic and Conditional Stylesheets

          Mohammad11th April 2021 at 6:01pm
          exmp064 solution
          How create CSS dynamically in Tiddlywiki?
          Use TW scrippting elements to generate a stylesheet dynamically!

          Example

          Assume you have some tiddlers contains CSS but NOT tagged with $:/tags/Stylesheet. It is also possible to add more tiddlers (for example those added by users), you can create a stylesheet by dynamic populating CSS from those tiddlers.

          As an example, we have three diffent tiddlers each have some CSS and tagged with exmp064 , to create a dynamic stylesheet create a tiddler as below

          • title: what you want
          • tag: $:/tags/Stylesheet
          • text:
          <$list filter="[tag[exmp064]]">
          <$transclude/>
          </$list>

          For details see Example 64: Demo

          Remarks

          As PMario stated the tiddlers that contains the CSS code needs the pragma as below. Have a look at the added "prettylink" rule. The below is valid CSS and the prettylink will be active.

          \rules only filteredtranscludeinline transcludeinline macrodef macrocallinline macrocallblock prettylink
          
          /*
          [[Link to the docs]]
          */
          
          .test-style { 
          color: red;
          }

          If you delete the pragma in such example, the pretty link like [[test */]] will fool the brower css parser.

          More resources

          Use a custom field to style a tiddler
          Tiddlywiki custom style faqs

          Dynamic CSS and Current Tiddler in Story River

          Mohammad11th April 2021 at 6:01pm
          solution task
          tags: $:/tags/Stylesheet
          type: text/vnd.tiddlywiki
          text:
          [data-tiddler-title="{{$:/HistoryList!!current-tiddler}}"] {
            height:100vh;
          }
          [data-tiddler-title="{{$:/HistoryList!!current-tiddler}}"] .tc-tiddler-body {
            height:90%;
            overflow: auto;
          }

          Easy local saving with Python

          Mohammad11th April 2021 at 6:01pm
          exmp108 solution

          This is a small python script start a local server for saving single wiki file. It is called Python Server.

          Linux usages

          1. Assume TiddlyWiki files live in /home/ubi/TW, abbreviated ~/TW.
            • Use the correct path for your case
          2. There (/home/ubi/TW) place the script as twserver.py.
          3. Start twserver.py for example in a terminal window:
            /usr/bin/python3 ~/TW/twserver.py
          4. Then point your browser to http://localhost:8080/.
          5. Status messages started appearing in the terminal window.
          6. In the browser window a list of files and directories below ~/TW appeares.
          7. Open one of TW files, e.g notes.html, and created a new Tiddler and save the changes (TW by default saves automatically)
            1. The server will create a backup in ~/TW/twBackups on the fly, e.g notes.html.YYYYMMDDhhmmss .
            2. And then save also the changes to e.g. ~/TW/notes.html.

          Windows usages

          The procedure is exactly the same as Linux. As an example consider the below file structure

          • Main folder: C:\TW
          • Server path: C:\TW\Python Server
          • Start Python: go to server path and luanch python twserver.py
          • Open browser and point to to http://localhost:8080/
          • Click on a TW file of choice to open it in browser
          • Make a new tiddler and save (or let TW saves automatically)

          Start a default wiki file

          How to instruct server to start a wiki file by default on Windows 1 ?

          • Open the twserver.py
          • Adding the line
          os.system('"C:/Program Files/Firefox Developer Edition/firefox.exe" -url http://127.0.0.1:8080/notes.html')

          before

          HTTPServer(('localhost',8080),ExtendedHandler).serve_forever()
          • It will start up firefox pointing to my notes.html
            • Note that here the Developer Edition of firefox so your path might be different based on your browser of choice!)

          Easy Local Saving with WebDav

          Mohammad11th April 2021 at 6:01pm
          saving solution

          The hacdias/webdav is a simple Go WebDAV server. It can be used to save Tiddlywiki single html file using any web browser (firefox, chrome, edge) even old browser like IE.

          The webdav command line interface is really easy to use so you can easily create a WebDAV server for your own user.

          How to use

          1. Simply download the suitable executable from https://github.com/hacdias/webdav/releases
            • for example for Windows 64bit downlaod windows-amd64-webdav.zip
          2. Unzip the file in the above step in your folder of choice
            • For demonstration purpose, C:\TW\Webdav is used here. This folder called webdav root folder.
          3. Create a folder in the root of webdav to put your wiki files there
            • In this demo it is C:\TW\Webdav\wikis
            • Copy some wiki files to wiki folder. For demo purpose here test.html has been put in this folder
          4. Create a configuration file in webdav root folder to setup the server as you like.
            • For demonstration purpose C:\TW\Webdav\webday.ymal is used here which is contains
              modify: true
              address: 127.0.0.1
              port: 8080
              tls: false
              cert: cert.pem
              key: key.pem
              users:
                - username: admin
                  password: admin
                  scope: ./wikis
              
          5. Create a shell script as below to fire up your server.
            • For demonstration it is called here C:\TW\Webdav\startServer.cmd containing the below script
              REM Start WebDav Server
              webdav.exe -c webdav.yaml
              
          6. Fire up your server by run C:\TW\Webdav\startServer.cmd script (e.g double click on it)
          7. Go to your browser of choice and in address bar type http://localhost:8080/yourwiki.html and login with "admin" and "admin" (or with the credentials you used in your configuration file).
            • In this demo test.html is used so in address bar type: http://localhost:8080/test.html

          Remarks

          • The wiki folder can have any number of sub folders like
            • C:\TW\Webdav\wikis\work
            • C:\TW\Webdav\wikis\personal
          • There is no need for shell script and one can fire up durectly from the Windows powershell or command line e.g
            • webdav.exe -c webdav.yaml
          • The webdav server allows to add any number of users each with different wiki folder, credential and access level
          • For path use / like a/sample/path. This is true also on Windows
          • Relative paths are considered with respect to location of webdav executable. for example
            • If on Windows webdav.exe is in C:\TW\Webdav and the scope (wikis folder) is C:\TW\Work then
              users:
                - username: admin
                  password: admin
                  scope: ./../Work
              
          • The webdav server accepts absolute (fixed) paths for example scope: "C:/TW/Work" note to / instead of \ on Windows.

          How to create a landing page

          • Assume you have setup your server as below
            scope: .
            modify: true
            address: 127.0.0.5
            port: 8086
            tls: false
            cert: cert.pem
            key: key.pem
            users:
              - username: admin
                password: admin
                scope: "./wikis"
          • Use a wiki e.g. landing-page.html stored in wikis folder which has a tiddler with the below contents to create a list of links to wikis
            <$list filter="[enlist{!!webdav-wikis}addprefix[http://127.0.0.5:8086/]addsuffix[.html]]">
            <li><a href=<<currentTiddler>> target=_blank><$view tiddler=<<currentTiddler>> field=title/></a></li>
            </$list>
            • a field called webdav-wikis filled with space separated title of wikis stored in wikis folder
          • For simplicity one can have a shell script (e.g landing-page.cmd) to start Microsoft Edge Chromium with laninding page as below:
            @echo off
            REM Open the Webdav landing-page
            
            echo start microsoft edge chromium
            start msedge.exe http://127.0.0.5:8086/landing-page.html

          References

          Edit Text Widget with Popup

          Mohammad11th April 2021 at 6:01pm
          exmp095 solution

          Here is a very simple example of a dropdown using focusPopup

          Editing Fields in the Current Tiddler in View Mode

          Mohammad11th April 2021 at 6:01pm
          solution

          Editing fields in the current Tiddler in view mode is tricky at the beginning because the field you are editing keeps loosing focus.

          Here is a quick solution to this issue.

          The simplest approach is to place the following in a tiddler tagged $:/tags/ViewTemplate

          <$edit-text field="description"/>

          Then wrap the above in a list widget to have it appear selectively such as only on tiddlers that already have the description field.

          Alternatively place he above in a template tiddler and transclude that In the view template tiddler

          in a tiddler tagged $:/tags/ViewTemplate

          {{||yourtemplate}}

          Using it through the view template works because what you are looking at is the rendering of the view template not your current tiddler. You may want to fold the tiddler so you do not see the content twice.

          Templates have the advantage of being able to have edits for multiple fields without making the view template tiddlers any more complex. eg

          Using template:<br>
          Description: <$edit-text field="description"/><br>
          Caption: <$edit-text field="caption"/><br>

          One way to make it possible to decide in any given tiddler if you want to edit a field in the current tiddler, when in view mode, is to create a field in any given tiddler called viewtemplate and name your view template eg viewtemplate: testTemplate

          Then to activate this add to a tiddler tagged $:/tags/ViewTemplate

          <$list filter="[all[current]has[viewtemplate]get[viewtemplate]]" variable="view-template">
            <$transclude tiddler=<<view-template>>/>
          </$list>

          So if the template is named in any tiddler the view template will transclude that template. You may want to add a list-before field with the value $:/core/ui/ViewTemplate/body in the tiddler tagged $:/tags/ViewTemplate

          What is nice is if the fields do not exist they are silently created.

          If you create your own new tiddler button you can set the viewtemplate field at creation or use a template to create your tiddlers with the view template already set. Or just clone an existing tiddler.

          Example i

          Try this for a quick way to edit in the view mode a field on the current tiddler

          QuickFieldEdit - edit-field-list
          Place this in a tiddler tagged $:/tags/ViewTemplate
          <$list filter="[all[current]has[edit-field-list]]" variable=nul>
             <$list filter={{!!edit-field-list}} variable=named-field>
                <<named-field>> <$edit-text field=<<named-field>>/><br>
             </$list>
          </$list>

          Now in any tiddler place a list of field names (space separated) in a field called edit-field-list eg caption description

          And you can edit these as text fields in the view mode.

          Example ii

          To edit the text field in the current Tiddler in view mode:

          • in a tiddler tagged $:/tags/ViewTemplate
          • put the below script
          in a tiddler tagged $:/tags/ViewTemplate
          <$list filter="[is[current]edit-inline[yes]]" variable=null>
            {{||$:/core/ui/EditTemplate/body/editor}}
          </$list>
          • Now set the field edit-inline on any tiddler to yes and you can edit the text directly.

          Embed SVG ICONS BUTTONS

          Mohammad11th April 2021 at 6:01pm
          solution task

          Add description on how colorify svg image

          Mohammad,

          Interesting.

          https://tiddlywiki.com/#Using%20SVG explains what happens, if the content type is set.

          The class tc-image-button seems to be used only for sizes, not for fill-definitions in vanilla, see
          https://tiddlywiki.com/#%24%3A%2Fthemes%2Ftiddlywiki%2Fvanilla%2Fbase

          All the best,
          Thomas

          Emergency Tiddler Export

          11th April 2021 at 6:01pm
          Import MyOwn

          This method is useful if, for any reason, you should find your current TiddlyWiki instance is not saving (e.g. a plugin or a server has stopped working). It should work on just about any platform.

          • Go to advanced search
            • Goto the filter tab
            • Enter the following filter text:
          [!is[system]!sort[modified]limit[25]]
          • Check the list of tiddlers.
          • Adjust the number "25" in the filter to make sure you found all your recently modified tiddlers
          • Press the bucket with the up arrow [] which appears on the right
          • A dialogue window will ask for a location to download a file called tiddler.json on your local drive, or depending on browser configuration, just alert you that such a file will be downloaded. Press save.
          • The tiddlers.json file can be imported (tools in sidebar) or drag and drop the file on the top line of the story river of another TW .
            • You can (de)select specific tiddlers.
            • Finally, press import.

          Empty Filter

          Mohammad11th April 2021 at 6:01pm
          filter solution
          Why blank filter in list does not execute the emptyMessage?

          The TW parser doesn't differentiate between a parameter with a blank value and a parameter that is not specified at all. Thus, since filter="", it's as if you had just written

          English

          17th April 2021 at 7:37pm
          MyContents

          Exact Phrase Search

          Mohammad11th April 2021 at 6:01pm
          solution

          Search Term:


          Ref: Jed Carty Solution. Also see this topic in forum

          Example 58: Logic of Set Widget

          Mohammad11th April 2021 at 6:01pm
          exmp058 solution

          Here's my take on examples plus a little bit of re-arranging and editing of Jeremy's descriptions

          1. If the "tiddler" attribute is present, get the text of the tiddler, or the value of the "emptyValue" attribute if the text field is blank or missing

            <$set name="myvar" tiddler="SomeTiddler" emptyValue="sometext">
            1. If the "subtiddler" attribute is present, get the text of the subtiddler from the specified tiddler, or the value of the "emptyValue" attribute if the subtiddler text is blank or missing

              <$set name="myvar" tiddler="SomeTiddler" subtiddler="SomeSubTiddler" emptyValue="sometext">`
            2. If the "field" attribute is present, get the value of that field, or the value of the "emptyValue" attribute if the field is blank or missing

              <$set name="myvar" tiddler="SomeTiddler" field="somefield" emptyValue="sometext">
            3. If the "index" attribute is present, get the value of the specified index, or the value of the "emptyValue" attribute if the index is blank or missing

              <$set name="myvar" tiddler="SomeTiddler" index="somefield" emptyValue="sometext">
          2. If the "filter" attribute is present and not blank, return the entire filter results using double square brackets quoting around any results that include spaces

            <$set name="myvar" filter="[somefilter[]]">
            1. If both the "filter" attribute and the "value" attribute are present and the filter results are not empty, return the value of the "value" attribute, otherwise return blank

              <$set name="myvar" filter="[somefilter[]]" value="somevalue">
            2. If both the "filter" attribute and the "emptyValue" attribute are present, return the entire filter results using double square brackets quoting around any results that include spaces, or the value of the "emptyValue" attribute if the result is empty

              <$set name="myvar" filter="[somefilter[]]" emptyValue="sometext">
            3. If the "filter" attribute, the "value" attribute, and the "emptyValue" attribute are present, return the value of the "value" attribute, or the value of the "emptyValue" attribute if the result is empty

              <$set name="myvar" filter="[somefilter[]]" value="somevalue" emptyValue="sometext">
            4. If both the "filter" attribute and the "select" attribute are present and the "select" attribute is a valid number "N", return the "Nth" result from the filter

              <$set name="myvar" filter="[somefilter[]]" select="3">
          3. If neither the "tiddler" or "filter" attributes are provided, return the value of the "value" attribute, or the value of the "emptyValue" attribute if the "value" attribute is blank or missing

            <$set name="myvar" value="somevalue" emptyValue="sometext">

          Example: contribute to an existing branch on GitHub

          30th April 2021 at 10:54am
          git Git与GitHub

          assumption: a project called repo already exists on the machine, and a new branch has been pushed to GitHub.com since the last time changes were made locally。reference from https://guides.github.com/introduction/git-handbook/

          change into the repo directory

          cd repo

          update all remote tracking branches, and the currently checked out branch

          git pull

          change into the existing branch called feature-a

          git checkout feature-a

          make changes, for example, edit file1.md using the text editor

          stage the changed file

          git add file1.md

          take a snapshot of the staging area

          git commit -m "edit file1"

          push changes to github

          git push

          Example: Contribute to an existing repository

          1st May 2021 at 8:56am
          Git与GitHub

          reference from https://guides.github.com/introduction/git-handbook/

          download a repository on GitHub.com to our machine

          git clone https://github.com/me/repo.git

          change into the repo directory

          cd repo

          create a new branch to store any new changes

          git branch my-branch

          switch to that branch (line of development)

          git checkout my-branch

          make changes, for example, edit file1.md and file2.md using the text editor

          stage the changed files

          git add file1.md file2.md

          take a snapshot of the staging area (anything that's been added)

          git commit -m "my snapshot"

          push changes to github

          git push --set-upstream origin my-branch

          Example:Start a new repository and publish it to GitHub

          1st May 2021 at 9:20am
          Git与GitHub Git与GitHub的同步

          First, you will need to create a new repository on GitHub. You can learn how to create a new repository in our Hello World guide. Do not initialize the repository with a README, .gitignore or License. This empty repository will await your code. reference from https://guides.github.com/introduction/git-handbook/

          create a new directory, and initialize it with git-specific functions

          git init my-repo

          change into the my-repo directory

          cd my-repo

          create the first file in the project

          touch README.md

          git isn't aware of the file, stage it

          git add README.md

          take a snapshot of the staging area

          git commit -m "add README to initial commit"

          provide the path for the repository you created on github

          git remote add origin https://github.com/YOUR-USERNAME/YOUR-REPOSITORY.git

          push changes to github

          git push --set-upstream origin main

          Excel

          19th April 2021 at 7:58pm
          Office

          Excel中清除数据中的格式和特殊字符

          14th April 2021 at 9:32pm
          Excel

          造成Excel的数据记录包含特殊字符的原因有一下几个:

          • 从数据库中导出时可能带有空格等特殊字符
          • 在Excel中通过替换空值来删除不需要的字符串
            • 在完成分类汇总后,会自动在作为分类的字段后面追加计数等汇总的字符串,在数据加工完成后是不需要这些被加上去的字符串,在Excel常用的方法就是批量替换为值来删除。
          这两种原因可以导致数据记录带有空格,在使用公式进行数据匹配和比对时就会出现难以发现的问题,有时候会出现连一条记录也不匹配的现象。

          如何清除数据记录中隐含的空格等字符呢
          • 选择编辑菜单的清除,下面有格式特殊字符的功能,可以尝试把所有的格式和特殊字符都清除掉
          • 也可以把现有的数据导出为纯文本文件,再把导出的文本文件导入即可。因为导出为纯文本文件时自然会清除其他特殊字符。

          Excel中行列选择技巧

          18th April 2021 at 7:08pm
          Excel
          • Ctrl+上、下箭头,是在首行和尾行之间跳转;Ctrl+左、右箭头是在首列和末列之间跳转。
          • Ctrl+Shift+下箭头是选中单元格所在的列,并在状态栏显示各种汇总统计数据,包括总行数。Ctrl+Shift+->是选中单元格所在的行,并在状态栏显示各种汇总统计数据,包括总列数;

          Excle的分类汇总应用

          14th April 2021 at 9:31pm
          分类汇总 Excel
          一个Excel文件的数据列表的某个字段、某几个字段包含多条相同数据时,可以对这些多次重复的字段进行分类汇总统计操作。
          这里以汇总统计一个单位的人数为例说明:
          比如数据表里包含一个单位的职工基本信息,属于单位的信息,每个人都是相同,属于个人的信息每个人是不同的。这样多条记录就会显示相同的单位代码、单位名称等单位信息,后边的个人信息部分是不同的。

          选中工作表数据区域,打开分类汇总功能,选择分类的字段,为了最后统计结果的可读性,这里选择单位名称;因为要统计每个单位的人数,所以选择汇总的方式计数,汇总的项也必须要选择,对于计数的统计要求来说,可选择不重复的字段作为计数统计的汇总选项,比如身份证号,不过经测试,对应计算统计计数的汇总,选择除了第一步的指定的分类字段之外的任意一个字段都可以。如果汇总方式是求和、平均等操作,根据实际情况选择对应的字段进行计算。

          分类汇总窗口最下边的几个选项都取消也是可以的,可以试试不同的效果。如果需要重新开始分类汇总操作,选择数据区域任意单元格,然后点击全部删除即可清除汇总数据,从头再做一遍分类汇总。

          完成分类汇总之后,会在表格数据区的左上角有1-2-3三层级联显示按钮,第3级是最初的明细数据记录,第二级就是我们需要的分类统计结果,第一级只有一行总数据。这里我们选择第二级即可仅仅显示分类汇总的结果。

          如果直接复制、粘贴当前显示的分类汇总数据,会把所有的数据都粘贴过来。这里就需要Excel里编辑菜单里提供的定位功能,也可以直接按下快捷键Ctrl+G,在定位窗口里选择可见单元格,点击定位即可。
          此时分类汇总区域会被自动选定,直接按下Ctrl+C或则右键复制,在新建的一个工作表里选择首行或者次行粘贴即可。

          复制出来的分类汇总数据,一般作为分类的字段会自动带有计数等字符串,需要使用Excel中清除数据中的格式和特殊字符,Excel中清除格式和特殊字符的方法来完成,在后续数据比对公式中才能正确匹配数据。可以参照下面的清除方法来清理格式和特殊字符:
          造成Excel的数据记录包含特殊字符的原因有一下几个:
          * 从数据库中导出时可能带有空格等特殊字符 *在Excel中通过替换空值来删除不需要的字符串 **在完成分类汇总后,会自动在作为分类的字段后面追加计数等汇总的字符串,在数据加工完成后是不需要这些被加上去的字符串,在Excel常用的方法就是批量替换为值来删除。 >这两种原因可以导致数据记录带有空格,在使用公式进行数据匹配和比对时就会出现难以发现的问题,有时候会出现连一条记录也不匹配的现象。
          >如何清除数据记录中隐含的空格等字符呢 >*选择编辑菜单的清除,下面有格式特殊字符的功能,可以尝试把所有的格式和特殊字符都清除掉 >*也可以把现有的数据导出为纯文本文件,再把导出的文本文件导入即可。因为导出为纯文本文件时自然会清除其他特殊字符。

          Exclude Tag in TOC Macro

          Mohammad11th April 2021 at 6:01pm
          solution tocxx

          More information at: Eric Shulman

          How to exclude some tiddlers tagged with say ignored from table of content when using toc-selective-expandable?

          This is the toc-selective-expandable code:

          \define toc-selective-expandable(tag,sort:"",itemClassFilter,exclude,path)
          <$vars tag="""$tag$""" sort="""$sort$""" itemClassFilter="""$itemClassFilter$""" excluded="""$exclude$ -[[$tag$]]""" path="""$path$/$tag$""">
            <ol class="tc-toc toc-selective-expandable">
              <$list filter="""[all[shadows+tiddlers]tag[$tag$]!has[draft.of]$sort$] -[[$tag$]] $exclude$""">
                <$list filter="[all[current]toc-link[no]]" variable="ignore" emptyMessage=<<toc-selective-expandable-empty-message>> >
                  <$macrocall $name=toc-unlinked-selective-expandable-body tag="""$tag$""" sort="""$sort$""" itemClassFilter="""$itemClassFilter$""" exclude=<<excluded>> path=<<path>> >
                </$list>
              </$list>
            </ol>
          </$vars>
          \end
          

          As you can see the macro accepts an exclude attribute

          This is the filter where your exclude filter would be used:

          <$list filter="""[all[shadows+tiddlers]tag[$tag$]!has[draft.of]$sort$] -[[$tag$]] $exclude$""">

          Example

          • Exclude tiddler tagged with ignored

          If you want to exclude - say - all tiddlers tagged ignored you pass

          exclude:"-[tag[ignored]]"

          • Exclude all tiddlers has a field named blue

          If you want to exclude all tiddlers with the field blue

          exclude:"-[has:field[blue]]"

          ExitVim

          28th April 2021 at 10:43pm
          linux unix vim

          How to exit the Vim editor?

          点击ESC进入“正常模式”,然后输入“:”,进入“命令模式”。此时屏幕的下方会出现一个冒号,你可以输入以下命令,并按“ENTER”执行:

          q ,退出(:quit的缩写)
          q!,退出且不保存(:quit!的缩写)
          wq,保存并退出
          wq!,保存并退出即使文件没有写入权限(强制保存退出)
          x,保存并退出(类似:wq,但是只有在有更改的情况下才保存)
          exit,保存并退出(和:x相同)
          qa,退出所有(:quitall的缩写)
          cq,退出且不保存(即便有错误)

          你也可以直接在“正常模式”下输入“ZZ”来保存并退出Vim(和:x相同),或者“ZQ”不保存并退出(和:q!相同)注意此处ZZ大写和小写是完全不同的。 Vim还有一个帮助菜单,可以通过“:help”调出来,基本能够解决你的绝大多数问题。

          Export Latest Changes in Current Session

          Mohammad11th April 2021 at 6:01pm
          solution

          haschanged[] will list all tiddlers since the last time the wiki was loaded from disk, ie the reload button, or if you close the tab and reopen again.

          It is perfect for an emergency save, like list everything changed since I loaded it this morning. Export to JSON, restore from last working version and import the json.

          Example

          1. Open the
          2. Choose the Filter tab
          3. Enter the below filter [haschanged[]!prefix[$:/state]!prefix[$:/temp]![$:/StoryList]![$:/HistoryList]]
          4. Click on export tiddler icon on the right side
          5. Save as JSON file

          You can import this JSON later into a wiki file.

          See also

          1. List the Last Ten Modified Tiddlers

          External Images and External Thumbnails

          Mohammad11th April 2021 at 6:01pm
          solution
          How to display external images (from local folders)?
          Have a thumbnail of the image displayed; click on thumbnail to see the full resolution image.

          The solution here uses two buttons, but it is possible to have a thumbnail and on click display the full resolution image. The solution includes two macros. The macro assumes

          • The images are located in a local folder
          • The thumbnails are stored in thumbs under image folder (default is TW-Images/thumbs/)
          \define imageit(image:"image",path:"TW-Images/")
          <$macrocall $name="imageaid" image="$path$$image$" thumb="$path$thumbs/$image$" state="$:/ImageState/$image$" />
          \end
          \define imageaid(image:"image.jpg" ,thumb:"pathToThumb", state:"ImageRevealState")
          <$button set="$state$" setTo="hide">Full image</$button>
          <$button set="$state$" setTo="show">Small Image</$button><p/>
          <$reveal type="match" state="$state$" text="show">
          <img src="$thumb$" />
          </$reveal>
          <$reveal type="match" state="$state$" text="hide">
          <img src="$image$" />
          </$reveal>
          \end
          • Main macro imageit
          AttributeDescription
          imgageThe image name including extention e.g. mypic.jpg
          pathThe path to image folder, defualt is TW-Images/

          The macro imageit calls the other macro imageid which uses in turn reveal widget to show the images.

          How it works?

          1. Put the macros in a tiddler tagged with $:/tags/Macro
          2. Call it whenever you like as below

            <<imageit "mypic.jpg">>
            <<imageit "sample.png" "d:/TW/pictures/">>

          Feather Icon Plugin

          Mohammad17th April 2021 at 10:31pm
          done solution task

          Fibonacci Sequence

          Mohammad11th April 2021 at 6:01pm
          solution
          Using the recursive feature of macro, develop a code to calculate the Fibonacci sequence
          The Fibonacchi sequence starts with "0" and "1" and each new number in the sequence is the sum of its two previous numbers.

          Solution

          The below macro is a solution to Fibonacci sequence using the recursive macro.

          Content and attributes

          AttributesTypeDescription
          lastrequiredthe last entry in the sequence. The default value is 0
          nextrequiredthe text entry in the sequence. The default value is 1
          countrequirednumber of entries in the sequence to be calculated. The default value is 1
          Remarks
          the fibber macro calculates the Fibonacci sequence using the recursive function fibber
          the first $list widget checks if the number of requested entries, count is zero, then it displays the last and next entries.
          if the count is not zero, then it decreases the count parameter by one and calculates the next entry by adding the previous values of entries last and next using the two $set widgets. It then calls the fibber with new values of count, last, and next
          the recursive calculation is continued until count is equal zero.

          Examples

          Starting from "0" and "1", calculate and print the next 6 numbers of Fibonacci sequence.

          Starting from "3" and "5", calculate and print the next 10 numbers of Fibonacci sequence.

          Field Value as DataTiddler Index

          Mohammad11th April 2021 at 6:01pm
          datatiddler solution

          For getting the property value from a data tiddler (dictionary) using a field, use the below syntax

          <$transclude tiddler="data-tiddler" index={{!!field-name}}/>

          Field Values of Several Tiddlers

          Mohammad11th April 2021 at 6:01pm
          exmp063 solution
          Assume several tiddlers have a common tag and a field called ingredient, how to display the value of the ingredient from all tiddlers with the tag?
          Use the list widget with get operator. Each input title is processed in turn. If the corresponding tiddler contains field ingredient, and the value of this field is not empty, then its value is appended to the output. For more information see [1].

          Example

          The below example displays the value of ingredient field from sveral tiddlers tagged with exmp063

          Duplicated values

          If there are several tiddlers with same ingredent value, how list (display) the value only one time (no repeated values)?
          Use the each operator, to remove duplicates. See [2] below
          <$list filter="[tag[food]each[ingredient]get[ingredient]]">
          
          </$list>

          Reference

          1. https://tiddlywiki.com/#get%20Operator
          2. https://tiddlywiki.com/#each%20Operator

          Fileds with Number

          Mohammad11th April 2021 at 6:01pm
          solution

          Filename for Save Wiki Button

          Mohammad11th April 2021 at 6:01pm
          solution
          How use a customized filename for saving Tiddlywiki as a singlefile?
          Referening ot Tiddlywiki documentation it is possible to have customized filename.

          If a tiddler named $:/config/SaveWikiButton/Filename is created, the text in that tiddler will be used as the default file name used for saving the TiddlyWiki.

          Example

          The below script in $:/config/SaveWikiButton/Filename cuase on save a filebame like MyWiki - 18.08.2019-17.40.24.html is created.

          MyWiki - <<now "0DD.0MM.YYYY-0hh.0mm.0ss">>.html

          Filter Constructor

          Mohammad11th April 2021 at 6:01pm
          solution

          Filter Returns Only the First suffix word

          Mohammad11th April 2021 at 6:01pm
          filter solution
          How to write a filter that returns only the first suffix word after a given prefix?
          Use prefix, removeprefix, and splitbefore operators to do that.

          Example

          On Tiddlywiki.com, go to the Advanced Search, Shadows tab, and search for (the prefix): $:/core/ui/ControlPanel/. It returns about 50 results. The only ones are requested are the ones that have a single word after that prefix. For example: the $:/core/ui/ControlPanel/Saving is rquested but NOT $:/core/ui/ControlPanel/Saving/DownloadSaver.

          So, the filter shall: 1. Find only the tiddlers have one word after the prefix $:/core/ui/ControlPanel/ 2. Return all those single words (remove the prefix)

          <$list filter="[all[shadows]prefix[$:/core/ui/ControlPanel/]removeprefix[$:/core/ui/ControlPanel/]splitbefore[/]!suffix[/]]">
          
          </$list>

          Remarks

          • The all[shadows]prefix[$:/core/ui/ControlPanel/] finds all shadow tiddlers their title starts with $:/core/ui/ControlPanel/
          • The removeprefix[$:/core/ui/ControlPanel/] remove the part $:/core/ui/ControlPanel/ from title
          • The splitbefore[/] filter, remove remaining text from title after /, but include / in the output.
          • The last parst !suffix[/] ignores all results having trailing /. This will remove those output having a/b/... means are not single word after $:/core/ui/ControlPanel/.

          A complete example

          The below script, adds two extra steps. It formats the output as numbered list and also make links to each tiddler. Note that the set widget creates the link. ` <ol> <$list filter="[all[shadows]prefix[$:/core/ui/ControlPanel/]removeprefix[$:/core/ui/ControlPanel/]splitbefore[/]!suffix[/]]" variable="xx1"> <$set name=lnk filter={{{[<xx1>addprefix[$:/core/ui/ControlPanel/]]}}}> <li><$link to=<<lnk>> > <$text text=<<lnk>>/> </$link></li> </$set> </$list> </ol>

          Filter Tiddlers by Combination of Tags

          Mohammad11th April 2021 at 6:01pm
          solution

          Filter to Find Links in Tiddler Fields

          Mohammad11th April 2021 at 6:01pm
          solution
          How it is possible to find all [[links]] in tiddler fileds?
          Use regexp with suitable input

          Example

          Find all wikitext links (those in double square brackeks [[]]) in a filed called myfield.

          You need to put your expression in a separate variable as below.

          <$vars reg="(?g)\[\[.*?\]\]">
          <$list filter="[!is[system]regexp:myfield<reg>]">
          
          </$list>
          </$vars>

          Remarks

          • The $vars widget defines a new variable reg to store the regexp search pattern
          • The $list widget then uses a regexp filter operator to find the wikitext links

          Filtered Transclusion

          Mohammad11th April 2021 at 6:01pm
          solution

          Also have a look at filtered transclusion.

          The below syntax can be used to transclude a list of tiddlers matching a specified filter:

          {{{[tag[2018.10.02]||DailyTemplate]}}}

          The DailyTemplate is a simple template tiddler is used for output.

          See the below the example in action. This example lists all tiddlers tagged with 2018.10.02.

          Filters

          11th April 2021 at 6:01pm
          MyOwn

          You can think of TiddlyWiki as a database in which the records are tiddlers. A database typically provides a way of discovering which records match a given pattern, and in ~TiddlyWiki this is done with filters.

          A is a concise notation for selecting a particular set of tiddlers, known as its . Whenever ~TiddlyWiki encounters a filter, it calculates the output. Further work can then be done with just those tiddlers, such as counting or listing them.

          The following example passes a filter to the macro to display a list of all tiddlers whose titles start with the letter H:

          <<list-links "[prefix[H]]">>

          A filter's output can change as tiddlers are added and deleted in the wiki. ~TiddlyWiki recalculates on the fly, automatically updating any filter-based counts or lists as well.

          Advanced Search has a tab that makes it easy to experiment with filters.

          Find out more:

          Filters inside Plugin Does not Work

          Mohammad11th April 2021 at 6:01pm
          solution
          There is a demo tiddler packed into a plugin and it used a viewtemplate. It did not work until it is opened and saved again. Example is sticky footer in Shiraz plugin!
          When you say “open them and save them again” are you referring to the tiddlers within your plugins? If so, it sounds like some of your filter expressions are only picking up “real” tiddlers, and not shadow tiddlers.

          If you want to get all tiddlers tagged “foo” including shadow tiddlers you need a filter like this:

          [all[shadows+tiddlers]tag[foo]] 

          Find DataTiddlers with Certain Index/Value

          Mohammad11th April 2021 at 6:01pm
          datatiddler solution
          How to list all DataTiddlers have an index/value pairs of (myIndex: myValue)?
          Use a filter to find all DataTiddlers and then search in them to see if there is a myIndex index and then check if its value is myValue then make a link to it.

          Example

          The below example finds and lists all DataTiddler:

          • have an index named: validateAll
          • that has its value: true
          • and it makes a link to the tiddlers
          \define make-link() <$link to="$(display)$">$(display)$</$link><br>
          
          
          <$list filter="[type[application/x-tiddler-dictionary]]" variable=dataTid>
          <$set name="display" value=<<dataTid>>>
          <$set name="data" tiddler=<<dataTid>> index="validateAll">
          <$list filter="[<data>] -[[true]]" emptyMessage=<<make-link>>>
          </$list>
          </$set>
          </$set>
          </$list>

          Remarks

          • The macro create a nice link to founded DataTiddlers
          • The first list widget lists all DataTiddlers in current wiki
          • The second list widget filters those DataTiddlers has a true value for validateAll index. It uses an else form, beacuse the filter is empty for those DataTiddlers are the answer, so the emptyMessage will triggered and a link will be created for answer.

          First.png

          11th April 2021 at 6:22pm

          Five Most Important Widgets

          Mohammad11th April 2021 at 6:01pm
          solution

          My take on the 5 most important widgets to learn would be:

          • <$transclude>
          • <$set> (note that <$tiddler> is really just an instance of the <$set> widget)
          • <$list>
          • <$text>
          • <$link>

          And if I was allowed another 5 they would be:

          • <$macrocall>
          • <$edit-text>
          • <$button>
          • <$navigator>
          • <$reveal>

          There’s also a bundle of widgets that I consider to be hacked that have hung over from the very early days of TW5. At the beginning we didn’t have flexible enough primitives to model some behaviour (like the story river), and so there’s a number of widgets that encapsulate blobs of JavaScript that could soon be replaced by more generic, smaller components:

          • <$navigator>
          • <$fieldmangler>
          • <$linkcatcher>
          • <$encrypt> for encrypting the payload of standalone HTML TiddlyWikis
          • <$raw>

          Flash离线安装包下载

          6th May 2021 at 10:56am
          flash

          适用于IE的activex版,下载地址 https://www.flash.cn/flashplayer/3200101/install_flash_player_ax_cn.exe 其中3200101代表32.0.0.101版本,IE的flash插件是activex版,直接是_cn结尾,代表中国版

          • 目前最新版本是3400137

          https://www.flash.cn/flashplayer/3400137/install_flash_player_ax_cn.exe

          适用于Firefox的Flash下载方式: https://www.flash.cn/flashplayer/3200101/install_flash_player_cn.exe

          其中3200101代表32.0.0.101版本,Firefox没有后缀,直接是_cn结尾,代表中国版 适用于Chrome的Flash下载方式: https://www.flash.cn/flashplayer/3200101/install_flash_player_ppapi_cn.exe

          3200101代表32.0.0.101版本,Chrome的flash插件是ppapi版,所以文件名是install_flash_player_ppapi_cn

          1. 2018年11月5日更新

          有网友指出下载出来提示版本更新,这里统一说一下3000154是我当时写这篇博客时的最新版本,现在的最新版本大家可以在https://www.flash.cn查看最新的版本号更改一下下载地址 比如现在的最新版本是32.0.0.101,对应的Chrome版flash的下载地址就为

          https://www.flash.cn/flashplayer/3200101/install_flash_player_ppapi_cn.exe

          Float Images

          Mohammad11th April 2021 at 6:01pm
          solution

          What is the best practice for embedding float images in tiddlers to prevent overflow?

          Solution

          1. https://groups.google.com/d/msg/tiddlywiki/5bZwwj6cyac/2LzFeA7AAwAJ
          2. https://groups.google.com/d/msg/tiddlywiki/5bZwwj6cyac/bz_GPwsoBAAJ

          Remarks

          The first solution seems to work better, the second does not work on TW 5.1.17 and above. The $:/plugins/.mr/shiraz/stylesheet/tw-adjustment has implemented the first version to wrap the float image inside the tiddler.

          Floating Images HowTo

          Mohammad11th April 2021 at 6:01pm
          floating-images solution

          There is a wikitext syntax for images eg: [img[pig.png]]. But what if I want to center the image. Or if I want the image left or right aligned and the text should flow around the image.

          There are 3 macros now.

          • <<image-left "pig.png">>
          • <<image-center "pig.png">>
          • <<image-right "pig.png">>

          Left aligned image

          <<image-left "pig.png">>

          Activates a float-left CSS rule for the image container.

          If you want to add a caption to the image, just use:

          <<image-left "pig.png" caption:"//Fig 1. floating image//" width:"20%">>

          As you can see, inline formatting rules can be used.


          Center aligned image

          The image below will be centred and slightly bigger. There is no text flow around the image. The macro is used like this:

          <<image-center "pig.png" caption:"Fig 2. Centered image" width:"30%">>

          Right aligned image

          This image uses:

          <<image-right "pig.png" caption:"''Fig 3. Float right image''" tooltip:"The lovely pig from north" width:"20%">>

          Clearfix

          Since "float-left" and "float-right" CSS rules have some effects on the text flow, we need a mechanism, that disables this effect. So we need to assign a special class to the last paragraph of this page: eg:

          @@.image-text ... @@

          Tiddlers in this solution

            Fold State

            Mohammad11th April 2021 at 6:01pm
            solution task

            Folding Editor

            Mohammad11th April 2021 at 6:01pm
            solution
            Is there a "folding editor" macro - could be called something like:
            <<folding-editor "Tiddler-01">>
            <<folding-editor "Tiddler-02">>

            A folding editor

            The below macro accepts a tiddler title and create an inline folding editor. A small pen is shown on the right and by clicking it reveals an editor to edit the tiddler inline.

            \define folding-editor(tiddler)
            <$set name="state" value={{{ [[$:/state/folding-editor/]addsuffix<currentTiddler>addsuffix<__tiddler__>] }}}>
            <$reveal stateTitle=<<state>> type="nomatch" text="edit">
            <span style="float: right;">
            <$button class="tc-btn-invisible" setTitle=<<state>> setTo="edit">{{$:/core/images/edit-button}}</$button>
            </span>
            <$list filter="[<__tiddler__>is[missing]] [<__tiddler__>!is[missing]!has[text]]">
            <<__tiddler__>>
            </$list>
            <$transclude tiddler=<<__tiddler__>> mode="block"/>
            </$reveal>
            <$reveal stateTitle=<<state>> type="match" text="edit">
            <span style="float: right;">
            <$button class="tc-btn-invisible" setTitle=<<state>> setTo="">{{$:/core/images/done-button}}</$button>
            </span>
            <$edit-text class="tc-edit-texteditor" tiddler=<<__tiddler__>> tag="textarea" default="" placeholder={{$:/language/EditTemplate/Body/Placeholder}}/>
            </$reveal>
            </$set>
            \end

            Form and Concatenation of Inputs

            Mohammad11th April 2021 at 6:01pm
            exmp106 solution
            How to read two inputs from a user form and create a link by concatenating two variables?
            Use a macro with $tiddler with $edit-text to

            Code

            • Everything (except the linkup macro definition) is inside a $tiddler widget to set the context, so you can just refer to the fields without having to specify the tiddler each time
            • The $vars widget gets the input from the temporary fields and puts them into variables
            • The <<linkup>> macro uses $(...)$ syntax to access the variable values instead of passing them as parameters.

            Example

            The below example shows how the code works.

            Formatting in WikiText

            22nd April 2021 at 6:56am
            WikiText

            Available character formatting includes:

            • `backticks` for code ()
              • Alternatively, ``double backticks allows `embedded` backticks``
            • ''bold'' for bold text ()
            • //italic// for italic text ()
            • __underscore__ for underscored text ()
            • ^^superscript^^ for superscripted text ()
            • ,,subscript,, for subscripted text ()
            • ~~strikethrough~~ for strikethrough text ()

            See also: Code Blocks in WikiText

            FromTiddlerWiki

            21st April 2021 at 6:54pm
            LearningTiddlyWiki

            Generating a new SSH key

            7th May 2021 at 10:04am
            Git与GitHub

            Generating a new SSH key and adding it to the ssh-agentAfter you've checked for existing SSH keys, you can generate a new SSH key to use for authentication, then add it to the ssh-agent.

            If you don't already have an SSH key, you must generate a new SSH key. If you're unsure whether you already have an SSH key, check for existing keys.

            If you don't want to reenter your passphrase every time you use your SSH key, you can add your key to the SSH agent, which manages your SSH keys and remembers your passphrase.

            Generating a new SSH key

            • Open Git Bash
            • Paste the text below,substituting in your GitHub email address.
              • ssh-keygen -t ed25519 -C "your_email@example.com"
              • this creates a new key ,using the provided email as a label.
                Generating public/private ed25519 key pair.
            • When you're prompted to "Enter a file in which to save the key,"press Enter .This accepts the default file location .
              • Enter a file in which to save the key (/c/Users/you/.ssh/id_ed25519):[Presss enter]
            • At the prompt, type a secure passphrase. For more information, see "Working with SSH key passphrases".
              • Enter passphrase (empty for no passphrase): [Type a passphrase]
                Enter same passphrase again: [Type passphrase again]

            reference from https://docs.github.docs

            Get All Matches in Field

            Mohammad11th April 2021 at 6:01pm
            exmp107 solution
            How to find all matches when looking for specified value in a field?
            this means to list all tiddlers has a certain field with the value is searched.

            Code

            Here a macro is developed. It gets the filed name and using a $list widget looks for the specified value

            • the input parameter fieldname is the name of field in which search will perform
            • the input parameter fieldvalue is the value for which search is performed

            Example

            Find all tiddlers have responder field contains the value Simon Huber

            Remarks

            • To return a link to matched tiddlers modify the code as below
              \define getAllMatches(fieldname,fieldvalue)
              <$list filter="[$fieldname$[$fieldvalue$]]">
                 <$link/><br>
              </$list>
              \end
            • Use $macrocall widget, which also invokes a macro, but allows to pass parameters whose values can be retrieved from variables instead of just being quoted strings. Thus:
              <$macrocall name="getAllMatches" fieldname=<<someFieldnameVariable>> fieldValue=<<someFieldvalueVariable>> />

            Get JavaScript Macro Output in Plain Format

            Mohammad11th April 2021 at 6:01pm
            solution
            Question: How get the JavaScript macro output as raw text (NOT wikified)?

            In a normal TiddlyWiki macro the below pragma

            \rules only

            prevents the macro output from wikification! How prevent TiddlyWiki from wikifying the output of a JS macro output or how get the raw text as output?

            Solution i

            Ref: Best solution

            The trick is to use the “type” attribute of the $macrocall widget. It causes it to interpret the text as plain text, rather than wikitext. However, if you try <$macrocall $type="text/plain" $name="dumpvariables"/> on it’s own you’ll see that it puts the text in a plain text block (like triple backticks). The wikify widget lets us extract the plain text from that output.

            <$wikify name="output" text="""<$macrocall $type="text/plain" $name="dumpvariables"/>""">
            <$text text=<<output>>/>
            </$wikify>

            Example

            <$wikify name="output" text="""<$macrocall $type="text/plain" $name="dumpvariables"/>""">
            ;Raw or plain output
            :<$text text=<<output>> />
            ;Wikified output
            :<<xx>>
            </$wikify>

            Remarks

            Here dumpvariables is a sample JS macro. You can use your own JS macro which may have many input parameters e.g

            <$wikify name="output" text="""<$macrocall $type="text/plain" $name="regexpsub" sourceText={{snr/sample01}} searchValue="is" replaceValue="IS" />""">
            <$text text=<<output>>/>
            </$wikify>

            Solution ii

            Ref: Alternative solution

            To render the plain output of a JS macro you can do this:

            <pre><$text text=<<macro-name-here>>/></pre>

            If you need the output in a variable you’ll need to use the wikify widget:

            <$wikify name="output" text="""<pre><$text text=<<macro-name-here>>/></pre>""">
            <$text text={{{ [<output>split[|]join[||]] }}} />
            </$wikify>

            Get Macro Name as String

            Mohammad11th April 2021 at 6:01pm
            solution
            How to get the macro name only NOT retreive the value?

            In filter expression, sometimes you need to get the name of macro instead of its value:

            • To get the macro name only use it inside []
            • To retrieve the value oc macro use it inside angle bracket <MyMacro>

            For example

            \define MyMacro() This is a test
            <$list filter="[[myMacro]addsuffix[ -Variable]]" ...
            <$list filter=:"[<MyMacro>addsuffix[ -Variable]]" ...
            
            • In the first $list it produces MyMacro - Variable
            • In the second $list it produces This is a test -Variable

            For a real use case see: Check if Macro or Variable Exists

            Get the First Line of Tiddler Text

            Mohammad11th April 2021 at 6:01pm
            solution
            How to extract the first line of text field of selected tiddlers?
            use $list with suitable filter to select the tiddlers, then use regexp to extract the firat line.

            Example

            Extract the first line of all tiddlers tagged with definition

            <$list filter="[tag[definition]sort[title]]">
               <$link /><br>
               @@color:green; {{{ [<currentTiddler>get[text]splitregexp[\n]first[]] }}}@@
            </$list>
            • The filter shown above matches all tiddlers tagged with "definition" and sorts the resulting list by title (case-insensitive).
            • Then, within the list widget, for each tiddler that was found, it sets the <<currentTiddler>> value and:
            • <$link /><br> outputs a line showing a link to the current tiddler
            • @@color:green; ... @@ applies CSS syntax to set the text color
            • ... is an "inline list" that:
              1. gets the text of the current tiddler
              2. splits it into lines (using \n as the line boundary)
              3. outputs the first item in the "inline list" (i.e., the first line of the text from that tiddler)

            GettingStarted

            24th April 2021 at 10:50am
            FromTiddlerWiki nodejs

            Welcome to ~TiddlyWiki and the ~TiddlyWiki community

            Visit https://tiddlywiki.com/ to find out more about ~TiddlyWiki and what it can do.

            Syncing Changes to the Server

            Before you can start storing important information in ~TiddlyWiki it is important to make sure that your changes are being reliably saved by the server.

            1. Create a new tiddler using the button in the sidebar on the right
            2. Click the button at the top right of the new tiddler
            3. Check the TiddlyWiki command line for a message confirming the tiddler has been saved
            4. Refresh the page in the browser to and verify that the new tiddler has been correctly saved

            Git Add

            2nd May 2021 at 11:00pm
            Git命令

            Git Clone

            3rd May 2021 at 9:19am
            Git命令

            git clone 我们使用 git clone 从现有 Git 仓库中拷贝项目(类似 svn checkout)。

            克隆仓库的命令格式为:

            git clone repo

            如果我们需要克隆到指定的目录,可以使用以下命令格式

            git clone repo directory

            数说明:

            repo:Git 仓库。

            directory:本地目录。

            比如,要克隆 Ruby 语言的 Git 代码仓库 Grit,可以用下面的命令:

            $ git clone git:github.com/schacon/grit.git 执行该命令后,会在当前目录下创建一个名为grit的目录,其中包含一个 .git 的目录,用于保存下载下来的所有版本记录。如果要自己定义要新建的项目目录名称,可以在上面的命令末尾指定新的名字 $ git clone git:github.com/schacon/grit.git mygrit

            Git Commit

            2nd May 2021 at 11:00pm
            Git命令

            Git Init

            3rd May 2021 at 8:57am
            Git命令

            Git 使用 git init 命令来初始化一个 Git 仓库,Git 的很多命令都需要在 Git 的仓库中运行,所以 git init 是使用 Git 的第一个命令。

            在执行完成 git init 命令后,Git 仓库会生成一个 .git 目录,该目录包含了资源的所有元数据,其他的项目目录保持不变。

            • 如果使用当前目录作为Git仓库,我们只需使它初始化。
            git init
            • 如果使用自定义的目录作为Git仓库,在 git init 后面加上自定义的目录:
            git init /d/newrepo
            这个命令会在指定的目录/d/newrepo (对于window来说就是d:\newrepo )生成.gt目录作为仓库。

            初始化后,会在 newrepo 目录下会出现一个名为 .git 的目录,所有 Git 需要的数据和资源都存放在这个目录中。如果当前目录下有几个文件想要纳入版本控制,需要先用 git add 命令告诉 Git 开始对这些文件进行跟踪,然后提交:

            $ git add *.c $ git add README $ git commit -m "初始化项目版本"

            以上命令将目录下以 .c 结尾及 README 文件提交到仓库中。

            注: 在 Linux 系统中,commit 信息使用单引号 ',Windows 系统,commit 信息使用双引号 "。

            所以在 git bash 中 git commit -m '提交说明' 这样是可以的,在 Windows 命令行中就要使用双引号 git commit -m "提交说明"。

            Git Push

            5th May 2021 at 5:20pm
            Git命令

            git push 命用于从将本地的分支版本上传到远程并合并。

            命令格式如下:

            git push <远程主机名> <本地分支名>:<远程分支名>

            如果本地分支名与远程分支名相同,则可以省略冒号:

            git push <远程主机名> <本地分支名>

            以下命令将本地的 master 分支推送到 origin 主机的 master 分支。

            $ git push origin main

            相当于:

            $ git push origin main:main

            https://github.com/tianqixin/runoob-git-test 为例,本地添加文件

            • $ touch runoob-test.txt # 添加文件
            • $ git add runoob-test.txt
            • $ git commit -m "添加到远程"
            • $ git push origin main # 推送到 Github *在本地仓库和远程仓库有通讯的仓库,新增文件后,使用git push -u 有时会提示错误信息,需要先git pull ,然后再提交。因此可以先使用git pull 命令或者git pull origin main 把远程仓库更新到本地,然后再使用git push -u origin main 提交新增的文件到远程的github仓库。

            git rm

            6th May 2021 at 3:01pm
            Git命令

            在把远程仓库clone到本地后,如果需要,可以删除部分不需要的文件,可是使用git rm filename 命令来实现。删除后再使用git push -u origin main

            • 先在工作区删除指定文件(windows下在资源管理器下删除,unix下使用rm命令删除文件)
            • git rm filename
            • git commit -m "delete filename "
            • git push -u origin main

            Git Status

            6th May 2021 at 10:51am
            Git命令
            • 在 git命令操作仓库过程的各个阶段,可以使用git status命令查询当前的状态。比如,在没有对仓库做增加、删除、修改等命令,git status会显示没有任何变化,如下图:
            • 在新增文件、修改文件内容后,都要使用以下几个步骤完成和远程仓库的同步:
              • git add filename 这里的add filename并不单单是指新增一个文件的意思,对于修改文件也是add filename,它是新增了对该文件的状态变化的管理
              • git commit -m " add ... or update .. "
              • git push -u origin main

            Git-Clone

            3rd May 2021 at 3:00pm
            git git&github github

            对已经存在数据的仓库,使用git clone复制到本地仓库

            • git clone <https://xxxxxx仓库链接地址> clone远程仓库到本地目录,自动添加origin别名
            • git branch my-branch 添加my-branch分支,对于已存在数据的仓库,不要直接修改
            • git checkout 切换到my-branch分支
            • git add dirname 添加本地仓库内新增的目录、文件
            • git commit -m "注释" 把项目目录或者文件提交到本地仓库
              • 可以使用git status 查看一下当前的状态
            • git pull 把远程仓库再次同步到本地
            • git push
              • 如果是通过git clone 的方式创建了本地的仓库,在本地仓库变化之后,要直接推送到远程仓库的话,需要先使用git pull 把远程仓库更新到本地,然后再直接使用不带任何参数的git push 命令即可上传文件,经常出现因为网路问题,导致git push 不成功,如下图,多试验几次成功了,到github.com的仓库了刷新一下就可看到。
              • git push –set-upstream origin main --set-upstream 是把远程仓库origin的main分支作为当前分支my-branch的upstream分支(上游分支),也就是把当前分支push到远程的origin main 分支下面
            • 完成push之后,会在github的仓库里多出一个my-branch分支,再使用pull request的工作流程完成合并即可。
            • 利用此功能,可以在github暂存自己的临时资料。

            Git-Init

            3rd May 2021 at 10:57pm
            git&github Git与GitHub的同步
            • git init
              • git init 不带任何指定目录的话,在当前目录下初始化仓库,生成一个隐藏的.git目录
              • git init /drv/path/dirname 比如 git init /g/testgit 就是在g:/testgit目录下初始化仓库(这里以Windows目录为例)
            • git add dirname 添加本地仓库内新增的目录、文件
            • git commit -m "注释" 把项目目录或者文件提交到本地仓库
            • git branch -M main 在本地创建一个main分支,因为目前本地仓库还没有任何分支
            • git remote add origin https://github.com/lsgxs2019/GitFromInti.git. 通过创建origin别名关联远程的Github仓库。这里也可以使用ssh协议git@github.com:lsgxs2019/GitFromInit.git如下图GitHub地址:
            • git push -u origin main -u 和 --setupstream 同等效果,都是把origin代表的远程仓库的main分支作为本地待推送分支的上游分支

            git-status

            6th May 2021 at 10:37am

            git-woking-directory

            6th May 2021 at 10:26pm
            git Git与GitHub

            git-workspace-stage-Repo-Remote

            6th May 2021 at 10:26pm
            git Git与GitHub

            Git命令

            6th May 2021 at 10:22pm
            Git与GitHub
            • 在Bash 命令窗口下获取帮助的方法,就是在命令的后边带上–help 参数即可显示详细的说明,比如:

            git --help

            git push --help

            • 如果你有足够的耐心,可以把这些命令的详细帮助文档阅读一下。

            Git于Github使用方法的摘录

            24th April 2021 at 2:35pm
            git github
            git的github使用,来自廖雪峰的官官方网站:
            理了理思路,也分享出来:
            
            首先,有3个仓库;
            
            1.远程 原作者的仓库:【twbs/bootstrap】
            2.远程 自己Fork出来的库:【my/bootstrap】
            3.本地:【local/bootstrap】
            其次,当我在【local/bootstrap】完成了开发工作,之后的工作流是什么样子的呢?
            
            1.把远程原作者的仓库【twbs/bootstrap】拉到本地,用Pull就行(Pull = Fetch+Merge);
            2.本地使用Rebase;
            3.此时,本地【local/bootstrap】与远程原作者的仓库【twbs/bootstrap】就算是同步完了;
            4.那么,远程 当初自己Fork出来的库【my/bootstrap】与远程原作者的仓库【twbs/bootstrap】还没同步呢,.咋办?此时,在本地使用PushOrigin推送到自己Fork出来的库【my/bootstrap】就行了;
            5.最后,给原作者发送1个PullRequest的消息。
            之前困惑我的事情解决了;至此,就算完成了3个库的同步了。
            
            关于git的github使用的知识摘录二:
            这样说可能会好理解点:
            
            有三个仓库,local(本地的),origin(远程你自己的) 和 upstream(远程别人的)。
            
            1. local 和 origin 要同步,就是采用之前讲的 git pull 和 git push;
            2. local 和 upstream 要同步,就要设置上游(git remote add upstream <upstream地址>),之后 git pull upstream master  拉下来同步
            3. origin 和 upstream 要同步,可以选择去 github 操作,去 origin 仓库向 upstream 发起 pull request,但是 head 设置为 upstream,base 设置为 origin,这相当于反向 pull request,可以让你 fork 的仓库与原仓库保持同步
            

            Git与GitHub

            6th May 2021 at 10:26pm

            Git与GitHub的安装及设置

            1st May 2021 at 9:04am
            Git与GitHub
            • 在GitHub上注册账号,建立一个仓库。
            • 下载Git并安装,一般选择使用Git Bash 作为终端,生成SSH密钥。
              • 打开Git Bash 终端,使用ssh-keygen 命令来在本地机器生成SSH密钥,选择ed25519的算法,如下:
              • ssh-keygen -t ed25519 id_ed25519.pub
              • 在这个命令中,-t ed25519 是采用ed25519的算法 。常见的 SSH 登录密钥使用 RSA 算法。RSA 经典且可靠,但性能不够理想。只要你的服务器上 OpenSSH 版本大于 6.5(2014 年的古早版本),就可以利用 Ed25519 算法生成的密钥对,减少你的登录时间。如果你使用 SSH 访问 Git,那么就更值得一试。Ed25519 的安全性在 RSA 2048 与 RSA 4096 之间,且性能在数十倍以上。
              • 如果是自己用的机器,偷个懒的话可不必设置密码,一路回车即可在.ssh/目录下生成id_ed25519.pub文件。
              • 使用 cat ed25519.pub 显示文件内容,复制到剪切板;也可使用clip < ~/.ssh/id_ed25519.pub 完成复制。
            • 登录到github.com,点击右上角个人图标,选在settings打开设置选项, 选在左侧面板出的SSH and GPG keys,选择new SSH Key ,粘贴ed25519.pub的内容保存即可。
            • 在本地机器配置GitHub用户信息及邮箱
              • git config –global user.name "你的GitHub用户名"
              • git config -global user.email "你的GitHub账号邮箱"
              • -global参数,表示当前机器上所有的 Git 仓库都会使用这个配置,当然你也可以对某个仓库指定的不同的用户名和邮箱

            Git与GitHub的基本概念

            29th April 2021 at 4:01pm
            git Git与GitHub github
            • GitHub是什么(What)

            gitHub是一个面向开源及私有软件项目的托管平台,因为只支持git 作为唯一的版本库格式进行托管,故名gitHub。Git(读音为/gɪt/。)是一个开源的分布式版本控制系统,可以有效、高速地处理从很小到非常大的项目版本管理。Git 是 [Linus Torvalds](林纳斯·本纳第克特·托瓦兹_百度百科 Torvalds/9336769) 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。

            • GitHub产生的背景(From)

            Git产生背景:同生活中的许多伟大事件一样,Git 诞生于一个极富纷争大举创新的年代。Linux 内核开源项目有着为数众广的参与者。绝大多数的 Linux 内核维护工作都花在了提交补丁和保存归档的繁琐事务上(1991-2002年间)。到 2002 年,Linux系统已经发展了十年了,代码库之大让Linus很难继续通过手工方式管理了,于是整个项目组开始启用分布式版本控制系统 BitKeeper 来管理和维护代码。 到 2005 年的时候,开发 BitKeeper 的商业公司同 Linux 内核开源社区的合作关系结束,他们收回了免费使用 BitKeeper 的权力。这就迫使 Linux 开源社区(特别是 Linux的缔造者 Linus Torvalds )不得不吸取教训,只有开发一套属于自己的版本控制系统才不至于重蹈覆辙。 gitHub于2008年4月10日正式上线,除了git代码仓库托管及基本的 Web管理界面以外,还提供了订阅、讨论组、文本渲染、在线文件编辑器、协作图谱(报表)、代码片段分享(Gist)等功能。目前,其注册用户已经超过350万,托管版本数量也是非常之多,其中不乏知名开源项目 Ruby on Rails、jQuery、python 等。

            • 基本功能(How)

            github作为开源代码库以及版本控制系统,Github拥有超过900万开发者用户。随着越来越多的应用程序转移到了云上,Github已经成为了管理软件开发以及发现已有代码的首选方法。如前所述,作为一个分布式的版本控制系统,在Git中并不存在主库这样的概念,每一份复制出的库都可以独立使用,任何两个库之间的不一致之处都可以进行合并。

            GitHub可以托管各种git库,并提供一个web界面,但与其它像 SourceForge或Google Code这样的服务不同,GitHub的独特卖点在于从另外一个项目进行分支的简易性。为一个项目贡献代码非常简单:首先点击项目站点的"fork"的按钮,然后将代码检出并将修改加入到刚才分出的代码库中,最后通过内建的"pull request"机制向项目负责人申请代码合并。已经有人将GitHub称为代码玩家的MySpace。在GitHub进行分支就像在Myspace(或Facebook…)进行交友一样,在社会关系图的节点中不断的连线。GitHub项目本身自然而然的也在GitHub上进行托管,只不过在一个私有的,公共视图不可见的库中。开源项目可以免费托管,但私有库则并不如此。Chris Wanstrath,GitHub的开发者之一,肯定了通过付费的私有库来在财务上支持免费库的托管这一计划。是的,我们正是这么计划的。通过与客户的接洽,开发FamSpam,甚至是开发GitHub本身,GitHub的私有库已经被证明了物有所值。任何希望节省时间并希望和团队其它成员一样远离页面频繁转换之苦的人士都会从GitHub中获得他们真正想要的价值。

            • 在GitHub,用户可以十分轻易地找到海量的开源代码

            • GitLab

            GitLab 是一个用于仓库管理系统的开源项目,使用Git作为代码管理工具,并在此基础上搭建起来的web服务。安装方法是参考GitLab在GitHub上的Wiki页面。

            GitLab是由GitLabInc.开发,使用MIT许可证的基于网络的Git仓库管理工具,且具有wiki和issue跟踪功能。使用Git作为代码管理工具,并在此基础上搭建起来的web服务。GitLab由乌克兰程序员DmitriyZaporozhets和ValerySizov开发,它使用Ruby语言写成。后来,一些部分用Go语言重写。截止2018年5月,该公司约有290名团队成员,以及2000多名开源贡献者。GitLab被IBM,Sony,JülichResearchCenter,NASA,Alibaba,Invincea,O’ReillyMedia,Leibniz-Rechenzentrum(LRZ),CERN,SpaceX等组织使用。

            • Git,GitHub与GitLab的区别
              • Git是一种版本控制系统,是一种工具,用于代码的存储和版本控制。
              • GitHub是一个基于Git实现的在线代码仓库,是目前全球最大的代码托管平台,可以帮助程序员之间互相交流和学习。
              • GitLab是一个基于Git实现的在线代码仓库软件,你可以用GitLab自己搭建一个类似于GitHub一样的仓库,但是GitLab有完善的管理界面和权限控制,一般用于在企业、学校等内部网络搭建Git私服。
              • GitLab可以独立的部署在公司自己的服务器上。

            GitHub和GiLlab两个都是基于Web的Git远程仓库,它们都提供了分享开源项目的平台,为开发团队提供了存储、分享、发布和合作开发项目的中心化云存储的场所。从代码的私有性上来看,GitLab 是一个更好的选择。但是对于开源项目而言,GitHub 依然是代码托管的首选。

            Git与GitHub的同步

            29th April 2021 at 4:01pm
            git Git与GitHub github

            Git与GitHub通讯的两种协议

            7th May 2021 at 7:10am
            Git与GitHub

            GitHubDocs

            26th April 2021 at 7:12am
            github

            Globally and Private Macro

            Mohammad11th April 2021 at 6:01pm
            exmp036 macro solution

            Global macro

            Global macro are those macros defined in tiddlers tagged with $:/tags/Macro. These macros available in every other tiddler. See also ImportVariable Widget on Tiddlywiki.com.

            Private macro

            Any macro defined with \define mac-name() pragma at the top of a tiddler is private to that tiddler. This means those tiddlers are not available in other tiddlers.

            The importvariables widget

            It is possible to restrict the scope of work of macros and variables in Tiddlywiki, to do that:

            1. Put all your private macro inside some tiddlers and tag them for example with privateMacro or whatever you like.
            2. Use the <$importvariables filter="[tag[privateMacro]]"> everywhere you want to use them

            Example

            Private Macro: A Case Study

            Go to Tab

            Mohammad11th April 2021 at 6:01pm
            solution

            GoToTab is a guide to help you create a link that, when clicked, opens a specific tab somewhere.

            GPT

            11th April 2021 at 6:01pm
            UEFI&GPT

            Greater and Less Than Macros

            Mohammad11th April 2021 at 6:01pm
            exmp053 solution

            The below macro was introduced by Arlen Beiler to create a filter to compare two numbers and return the bigger one

            \define gt(a, b) $a$ $b$ +[nsort[]last[1]remove[$b$]]

            Remarks

            • a, b' two number as input parameters
            • gt filter will return a, if it is greater than b

            Based on this idea, the below macro is developed to return the smaller number

            \define lt(a, b) $a$ $b$ +[nsort[]first[1]remove[$b$]]

            Remarks

            • a, b' two number as input parameters
            • lt filter will return a, if it is less than b

            See Example 53

            Gruvbox Dark Color Palette

            Mohammad11th April 2021 at 6:01pm
            solution

            Hacked Table of Content Macro

            Mohammad11th April 2021 at 6:01pm
            solution

            Description

            How to customize the toc macro to list tiddlers and their tags below?

            <<toc solution>>

            1. A Calculator for Binary Operation
              exmp099 solution
            2. A Dictionary Project
              datatiddler exmp044 solution
            3. A Direct Open for Edit on Wiki Crash
              exmp105 solution
            4. A Gallery of Core Imgaes
              image solution
            5. A Rdio Button Macro
              solution
            6. A Simple Recursive TOC Macro
              exmp112 solution
            7. A Simple Time Stamp
              solution
            8. A Two Way Conditional View Template
              solution
            9. Activate the Spell Check with Codemirror
              solution
            10. Add a New Element to Page Controls
              solution
            11. Add Filter Search into Sidebar
              solution
            12. Add Language Brushes to Highlight.js Using Startup Modules
              solution
            13. Add or Remove Tiddler Fields
              exmp029 fieldmangler solution
            14. Add Remove Tags
              exmp024 solution
            15. Alias and Short Name for Template
              solution
            16. Alternate Message of the Day Generator
              solution
            17. Another DataTiddler and Tiddler Widget
              datatiddler exmp005 HowToCreateContentTree solution
            18. Append Items to List Field
              solution
            19. Append Rules Pragma
              solution
            20. Appending Tiddlers to a List
              solution
            21. Apply Custom Styles Dynamically
              css exmp023 solution
            22. Archipel TiddlyWiki toc Based on D3JS
              solution
            23. Base Conversion
              exmp097 solution task
            24. Batch Delete Export Tiddlers
              batch solution
            25. Batch Edit Tiddler Title
              solution
            26. Behavior of Svg Internal Links
              done solution task
            27. Best Pattern in Actions and Button Widget
              solution
            28. Better Performance in Filter Run
              solution
            29. Bookmarks with ID and Links
              solution task
            30. Build Name from Complex Parts
              solution
            31. Button Actions versus Button Inline Actions
              solution
            32. Button CSS Class
              solution
            33. Buttons to Sort Tiddlers in Tagpill
              exmp047 solution
            34. Camel Case Words in List Output
              solution variable
            35. Canonical URI and External Image
              solution
            36. Center Table Horizontally
              solution
            37. Change Body Font Size
              solution
            38. Change Border Color in Search Bar
              solution task
            39. Change Password on Tiddlyspot
              solution
            40. Change the Background Color of Sidebar
              solution
            41. Change the Color of Sidebar Tabs
              solution
            42. Change the Colors of One Editor Toolbar Button
              solution
            43. Check if Macro or Variable Exists
              exmp052 solution
            44. Check if Passed the Macro Parameter
              solution
            45. Check if Tiddler Exist
              solution
            46. Check if Tiddler Newer Than the Other
              exmp054 solution
            47. Checkbox Like Radio Button - New Solution
              solution task
            48. Checkbox with Three State
              solution
            49. Checkboxes Like Radio Button
              solution
            50. Chnage Colors and Styles of Control Buttons
              solution
            51. Cloning Tiddlers
              solution
            52. Close all Tiddlers and Open Home
              button message solution
            53. Colorful Tab
              solution tabs
            54. Colors
              solution
            55. Combo Search: Standard and Filter Search
              exmp103 solution
            56. Comma Separated List of Tiddlers
              last operator solution
            57. Compare Texts of Two Tiddlers
              done solution task
            58. Compare Variables for Equality and Inequality
              reveal solution
            59. Compose and Send Emails from a Tiddler
              solution
            60. Concatenate Different Tiddlers in one Tiddler
              solution
            61. Concatenate the Contents of Different Tiddlers
              solution
            62. Concatenating Text to Make Dynamic URLs
              concatenate solution
            63. Test of conditional output
            64. Conditionally Display The Tiddler Contents
              exmp016 solution viewtemplate
            65. Consolitate the Current Story to Default
              solution
            66. Copy Result of Wikitext to clipboard
              solution
            67. Count items within a Field
              exmp049 solution
            68. Create a Borderless Table
              solution
            69. Create a Doubly Sorted Table
              exmp057 solution
            70. Create a list of numbers
            71. Create a New Tiddler Using Input Box
              solution
            72. Create a Simple Comment Button
              solution
            73. Create a Tiddler if not Existed
              solution
            74. Create External Images from A Directory
              image solution
            75. Create New Tiddler and TextReference in Tags
              button solution
            76. Create New Tiddler with a Link to Current in the Text
              exmp113 solution
            77. Create New Tiddler with Content
              solution task
            78. Create Persistent Tag with Color
              solution
            79. Create Svg Icons Using Macro
              exmp061 solution
            80. Create Tiddler with Sequence Number
              exmp050 solution
            81. Create Tiddler with Title and Time
              solution
            82. CSS and Blockquote
              solution
            83. CSS and List Style Color
              solution
            84. CSS for Background Color of Tiddler Title
              solution
            85. CSS for Last Char of Title
              exmp010 solution
            86. CSS inside Macro
              solution
            87. Custom Filter in Advanced Search
              solution
            88. Custom Style and Classes in Wikitext
              solution
            89. Customize Look of Editor 5.1.18
              solution
            90. Customize Search Result
              search solution
            91. Customize Tagpill Using CSS
              solution
            92. Customize the Buttons on Editor Toolbar
              solution
            93. Customized Numbered Lists
              solution
            94. DataTiddler Terminology
              datatiddler solution
            95. DataTiddler Value Set to a Variable
              datatiddler solution
            96. Date Format in Tiddler Subtitle
              solution
            97. Date in Custom Field
              solution
            98. Defualt Tiddlers as a Blog
              solution
            99. Delete a List of Tiddlers
              batch solution
            100. Delete Bulk of Tiddlers Selectively
              solution
            101. Delete Tiddlers
              batch solution
            102. Delete Tiddlers Based on a Field
              field solution
            103. Disable Dragability of an Element
              solution
            104. Disable Search Autofocus
              solution
            105. Disable Timestamp
              solution
            106. Display All Core Images in a Table
              image solution
            107. Display Certain Level of Tag Tree
              solution
            108. Display Custom Date Format
              exmp084 solution
            109. Display Fields with Specific Prefix
              exmp081 solution
            110. Display Tagged Tiddlers Using ViewTemplate
              $:/_site/tagging solution tagging
            111. Drag and Drop of a Whole File
              import solution
            112. Drag and Drop of Tag Pills
              import solution
            113. Droppable Widget and Last Item in the List
              solution
            114. Dynamic and Conditional Stylesheets
              exmp064 solution
            115. Dynamic CSS and Current Tiddler in Story River
              solution task
            116. Easy local saving with Python
              exmp108 solution
            117. Easy Local Saving with WebDav
              saving solution
            118. Edit Text Widget with Popup
              exmp095 solution
            119. Editing Fields in the Current Tiddler in View Mode
              solution
            120. Embed SVG ICONS BUTTONS
              solution task
            121. Empty Filter
              filter solution
            122. Exact Phrase Search
              solution
            123. Example 58: Logic of Set Widget
              exmp058 solution
            124. Exclude Tag in TOC Macro
              solution tocxx
            125. Export Latest Changes in Current Session
              solution
            126. External Images and External Thumbnails
              solution
            127. Feather Icon Plugin
              done solution task
            128. Fibonacci Sequence
              solution
            129. Field Value as DataTiddler Index
              datatiddler solution
            130. Field Values of Several Tiddlers
              exmp063 solution
            131. Fileds with Number
              solution
            132. Filename for Save Wiki Button
              solution
            133. Filter Constructor
              solution
            134. Filter Returns Only the First suffix word
              filter solution
            135. Filter Tiddlers by Combination of Tags
              solution
            136. Filter to Find Links in Tiddler Fields
              solution
            137. Filtered Transclusion
              solution
            138. Filters inside Plugin Does not Work
              solution
            139. Find DataTiddlers with Certain Index/Value
              datatiddler solution
            140. Five Most Important Widgets
              solution
            141. Float Images
              solution
            142. Floating Images HowTo
              floating-images solution
            143. Fold State
              solution task
            144. Folding Editor
              solution
            145. Form and Concatenation of Inputs
              exmp106 solution
            146. Get All Matches in Field
              exmp107 solution
            147. Get JavaScript Macro Output in Plain Format
              solution
            148. Get Macro Name as String
              solution
            149. Get the First Line of Tiddler Text
              solution
            150. Globally and Private Macro
              exmp036 macro solution
            151. Go to Tab
              solution
            152. Greater and Less Than Macros
              exmp053 solution
            153. Gruvbox Dark Color Palette
              solution
            154. Hacked Table of Content Macro
              solution
            155. Hashtag to Tag
              solution
            156. Help Button
              solution
            157. Hide a Field in Edit Mode
              solution
            158. Hide Count Output If Zero
              solution
            159. Hide Part of Text
              solution
            160. Hide Tags from Tagspill Drop down Menu
              solution
            161. Hide Username Date and Tags in Printing
              solution
            162. Hierarchical Tag Tree
              solution
            163. How Check a Tiddler Exist
              solution
            164. How Create a Plugin Library
              solution
            165. How display backtick inside a Code Segment
              solution
            166. How Exclude Some Indexes in Filter
              datatiddler solution
            167. How Prevent Resizing textarea
              solution
            168. How Sidebar Works
              solution
            169. How Switch a Tag among Tiddlers
              done exmp065 solution task
            170. How Temporarily Show a Tiddler in Sidebar
              solution
            171. How to Add Images to Sidebar
              solution
            172. How to Adjust the Tiddler Width
              solution
            173. How to Download a Complete Wiki
              solution
            174. How to Group Untagged Tiddlers
              solution
            175. How to Truncate Long String with Ellipsis
              solution
            176. How to Write a Plugin
              solution
            177. How to write Widgets
              solution
            178. How Use Now Macro inside a Filter
              solution
            179. Html5 Date Attribute
              solution
            180. Html5 Detail Tag
              html5 solution
            181. Html5 Forms Elements
              html5 solution task
            182. If Field Macro
              solution
            183. If Then Else
              solution
            184. If Then Else Action Macro
              macro solution
            185. Iframe and Tiddlers Contains a Html Page
              exmp032 solution
            186. Image with Tooltip
              solution
            187. Import JSON Tiddler
              solution
            188. Inject or Import Tiddlers through Bookmarklets
              exmp100 solution
            189. Intersection of Two Filter Expression
              solution
            190. Introduction to Tiddlywiki
              solution
            191. Iterate DataTiddler Indexes
              exmp039 solution
            192. Javascript Macro
              solution
            193. Line break in Filters Attributes
              solution
            194. Link to a PDF File on a Specific Page
              exmp026 solution
            195. link to ext pdf and like that
              solution task
            196. List All Fields and Count Them
              solution
            197. List all Tiddlers Created in x Days
              solution
            198. List All Tiddlers Created or Modified in Last x Days
              solution
            199. List and Transclude Tiddlers with Today Date
              solution
            200. List by Common Fields
              exmp110 solution
            201. List by Tag but Sort and Show by Field Value
              exmp056 solution
            202. List Contact Tiddlers Based on a Category
              exmp001 solution
            203. List filter with empty tiddler values
              solution
            204. List Results into Hardcopy
              solution
            205. List the Last Ten Modified Tiddlers
              exmp031 solution
            206. List Tiddler Tags Based on a Field
              exmp021 solution
            207. List Tiddlers with Their Tags as Tagpill
              solution
            208. List Widget and Switch Case Construct
              solution
            209. Load a Local HTML File in an Iframe
              solution
            210. Logical Opertaion with Filters
              filter solution
            211. Lowercase and Space Handling in Fields Name
              solution
            212. macro for comparison
              solution task
            213. Macro in Tiddlywiki: A Programming Issue
              solution
            214. Macro Overloading
              exmp043 solution
            215. Macro with Dismiss Alerts Inline
              exmp092 solution
            216. Macro with Variable Number of Arguments
              exmp013 solution
            217. Make Version Incremented Backup on Windows
              solution
            218. Manually Add More Language Brushes to Highlight.js
              solution
            219. Mat Star Hub +
              solution task
            220. Match All List Items and Display Their Content
              exmp091 regexp-tutorial solution
            221. Math Macro a Simple Calculator
              solution
            222. Maximum Width of TOC
              solution tocxx
            223. Message of the Day Generator
              exmp094 solution
            224. More on Conditional Output
              conditional solution
            225. Multiple Sort Rules in TOC
              solution
            226. Multiple Wiki and Browser Tab Management
              solution
            227. Navigate to a Tiddler with Space in Title
              solution
            228. NEED disucssion
              solution
            229. Neocities Saver Plugin
              solution
            230. Nested Referencing Fields
              solution
            231. nesting the effect of brackets
              solution
            232. New Tiddler 5
              done solution task
            233. Nightly Build
              solution
            234. Notes on Macro
              solution
            235. Notes on Using External Web Content v1
              solution
            236. Notification Duration
              solution
            237. Online Dictionary Lookup
              exmp028 solution
            238. Open a Tiddler without Navigating to It
              solution
            239. Open All Tiddlers Meet Some Criteria
              solution
            240. Open all Tiddlers with Tag-X
              exmp033 solution
            241. Order of Stylesheets in Tiddlywiki
              solution
            242. passing multiple strings
              done solution task
            243. PDF Document Link
              solution
            244. Performance Instrumentation
              solution
            245. Performance on Mobile
              solution task
            246. Plugins and Node.JS version of Tiddlywiki
              nodejs solution
            247. Populate Story List with Tiddlers
              solution
            248. Position of an Item in a List with Respect to Selected Item
              exmp085 solution
            249. Prevent Empty Story River
              solution
            250. Private Macro
              solution
            251. Providing Variable to tm-notify Widget Message
              exmp098 solution
            252. Read from CSV File
              solution
            253. Recent Tab and Bold Timeline
              exmp030 solution
            254. Regexp to Find all Tiddlers with .ext in Their Name
              exmp006 regexp-tutorial solution
            255. Remove Blue Border from Button
              solution
            256. Remove Index with Zero Value
              datatiddler exmp093 solution
            257. Remove Surrounding Quotes
              else solution
            258. Replace or Rename Fields
              exmp104 solution
            259. Rewrite of TOC Macro
              solution tocxx
            260. Sample JavaScript Code
              solution
            261. Save the Filter Output
              solution
            262. Save Tiddlywiki
              LearningTiddlyWiki Save solution
            263. Scroll to top when click on a tiddler in storyriver
              solution
            264. Search DataTiddler Using regexp
              datatiddler solution
            265. Search in Fields
              solution
            266. Search in Local Wiki Files
              solution
            267. Search in Tags
              solution
            268. Search Operator and Variables
              solution
            269. Search Titles Followed by Text
              operator search solution
            270. Select among Three Tiddlers with Priority
              solution
            271. Select Icon
              solution
            272. Select Widget with Actions
              exmp111 solution
            273. Selection Constructor
              solution
            274. Selective Coloring of TOC Entries
              solution
            275. Serach in Filtered List of Tiddlers
              solution
            276. Set currentTiddler as Default Value for Macro Parameter
              solution
            277. Setting Empty Value for a Macro Parameter
              solution
            278. Shadow Tiddler
              solution
            279. Shorthand Syntax Summary
              solution syntax
            280. Show a Summary on Tiddler
              exmp062 solution
            281. Show a Table of Content on Each Tiddler
              solution
            282. Show All Tags in a Wiki
              solution
            283. Show Icons of Tiddler
              solution
            284. Show Tags with Title in Search Results
              solution
            285. Show Tiddlers Created in the Same Month Day
              exmp086 solution
            286. Simple Comparison of Two or More Variables
              solution
            287. Simple Comparison of Two Variables
              solution variable
            288. Simple Template with List
              solution
            289. Size of Icons in Tiddler Toolbar
              css solution
            290. Slider Macro
              solution
            291. Slider Macro II
              solution
            292. Slider Macro III
              solution
            293. Some Mathematical Calculations
              exmp114 solution
            294. Sort Tag Wizard
              exmp048 solution
            295. Sort Tiddlers in Tag Pill
              exmp046 solution
            296. Sorting in Table of Contents
              solution
            297. Specification for Autonumbering References
              idea solution
            298. Spellcheck Preview in Codemirror
              solution
            299. Split Date into Day Month Year
              exmp037 solution
            300. Stitch Tiddlers together for Printing
              solution
            301. Story River in Two Columns
              solution
            302. Stylesheet for Print Media
              css print solution
            303. Stylesheet Tiddler or Inline CSS
              solution
            304. Stylesheet with Conditional Rules
              exmp018 solution
            305. Subfilter Example
              exmp020 solution
            306. Summarizing Data Tiddler
              exmp109 solution
            307. Summing Values in Fields
              exmp118 solution
            308. SVG ICONS as BUTTONS
              solution
            309. SVG Images Transclusion
              solution
            310. Switch Case Construct
              exmp068 solution
            311. Switch Field Values and Select Widget
              exmp067 solution
            312. Switch Tags without Change in Timestamp
              exmp025 solution
            313. Switch Two Fields Value
              exmp066 solution
            314. Syntax for Using Brackets
              solution syntax
            315. System Field and User Field
              solution
            316. Table Class by Variable
              solution table
            317. Table Tool
              solution table
            318. Tabs Macro and Tiddlers Transcluding Fields
              exmp060 solution
            319. Tabs Macro Button Template
              exmp115 solution
            320. Tag Cloud
              exmp083 solution
            321. Tag Hierachy and Table of Contents
              solution
            322. Template and Tiddler Widget
              solution tiddler
            323. Template for Displaying Fields in View Mode
              done solution task
            324. Template to Show Tagged Tiddlers as a Footer
              solution viewtemplate
            325. Test Filters
              solution
            326. Text Formatting with Macro
              exmp007 solution
            327. The Default Input to Filters
              solution
            328. The has Operator Behaviour
              operator solution
            329. The is Blank Operator
              exmp119 solution task
            330. The List Field
              list solution
            331. The Logic by Set Widget
              exmp058 solution
            332. The RAM Usage of Tiddlywiki on Node.js
              solution
            333. Tiddler Associated with a Button
              solution state
            334. Tiddler Count to Dictate HTML Table Rowspan
              solution
            335. Tiddler Toolbar Icon
              solution
            336. Tiddler Width and Viewport Size
              solution
            337. Tiddlywiki CSS Prefixes
              solution
            338. Tiddlywiki Favicon
              solution
            339. Tiddlywiki in Open Source
              solution
            340. Tiddlywiki in-built CSS Classes
              solution
            341. TiddlyWikiPluginSkeleton: Creating New Plugin
              solution
            342. Timimi and Snapshot
              solution
            343. Tips: Advanced Search with Search Operator
              search solution
            344. TOC Macro and Exclude Filter
              solution tocxx
            345. Toggle Button
              exmp080 solution task
            346. Toggle Two Stylesheet
              exmp096 solution
            347. Toggle UI Elements in Edit Mode
              solution
            348. Top Level Tiddlers
              solution
            349. Transclude a Missing Tiddler
              solution
            350. Transclude the Content of Tiddler into a Live Editor
              exmp055 solution
            351. Transclude Tiddlers Into Table
              solution
            352. Transcluded Codeblock
              exmp012 solution
            353. Transclusion by Template
              exmp008 solution
            354. TW and Search URLs
              solution
            355. TW5 is Really Two Separate Languages
              concept solution
            356. Tweak Sidebar Background
              css solution
            357. UI to Delete Temporary and State Tiddlers
              exmp069 solution
            358. Unhide Raw Content of Tiddlers Like Template and Global Macro
              solution
            359. Unique Title
              solution
            360. Unique Title for State Tiddlers
              exmp117 solution
            361. Update Fields on Multiple Tiddlers
              solution task
            362. Use Browser Bookmarks for Drag and Drop
              solution
            363. Use TW Svg Icons in Text
              exmp082 solution
            364. Use Variable in CSS Calc Function
              exmp017 solution
            365. Useful Little TiddlyWiki tips
              solution tip
            366. Using Google Font with Tiddywiki
              solution
            367. Using Named Colors
              css exmp011 palette solution
            368. Using Radio Button
              solution
            369. Using Svg in CSS Content Properties
              solution
            370. Using Tiddler Widget with DataTiddler
              datatiddler exmp004 solution tiddler
            371. Variable as DataTiddler Index
              datatiddler solution
            372. Variable Class Attribute for Html Tag
              solution variable
            373. Variable Overriding
              solution variable
            374. Variable Reference inside Macro
              solution
            375. Variables vs. Parameters
              solution syntax variable
            376. Variables, Fields and Filters in TiddlyWiki
              solution syntax
            377. ViewTemplate Acts on Child Tiddlers
              solution
            378. When to Use Temp and When to Use State Tiddlers
              solution
            379. Widdly
              solution
            380. Widgets in Conventional Programming
              solution
            381. Wikify Widget and White Spaces
              solution
            382. Wikilink ans Rule
              solution
            383. Wkify Widget and Macro Variable
              exmp051 solution
            384. Working with SVG
              exmp059 solution svg
            385. Zero Padded Numbers with Range
              solution

            Hard Linebreaks in WikiText

            22nd April 2021 at 6:56am
            WikiText

            The usual handling of paragraphs in wikitext causes single line breaks to be ignored, and double linebreaks to be interpreted as the end of a paragraph.

            This behaviour isn't convenient when dealing with material that incorporates hard linebreaks - for instance, poetry. You can mark a block of content as containing hard line breaks like this:

            Hashtag to Tag

            Mohammad11th April 2021 at 6:01pm
            solution

            This is a simple plugin to convert any word in your text field starting with a predefined symbol into tags of that tiddler upon saving.

            How it works

            • Go to Control Panel > Appearance > Hashtag2tag and define a symbol. For eg: # or &
            • Done!! Now you can create a new tiddler and type in your text with hashtags and save.

            Have fun with

            11th April 2021 at 6:02pm

            Headings in WikiText

            22nd April 2021 at 6:56am
            WikiText

            Headings are specified with one up to six leading ! characters:

            ! This is a level 1 heading
            
            !! This is a level 2 heading
            
            !!! This is a level 3 heading

            CSS classes can be assigned to individual headings like this:

            Help Button

            Mohammad11th April 2021 at 6:01pm
            solution

            Hide a Field in Edit Mode

            Mohammad11th April 2021 at 6:01pm
            solution

            How fields are hidden from editor?

            • Fields are hidden from the editor if the tiddler with the title $:/config/EditTemplateFields/Visibility/ plus the name of the field contains "hide". For example, $:/config/EditTemplateFields/Visibility/title
            • The implementation details can be seen in the shadow tiddler $:/core/ui/EditTemplate/fields

            Example

            If you want to hide the note field from editor

            • create a tiddler titled $:/config/EditTemplateFields/Visibility/note
            • Put hide inside its text (bodey)

            To see what fields are hidden

            • Try the following in the "filter" tab of advanced search:
            [all[shadows+tiddlers]prefix[$:/config/EditTemplateFields/Visibility/]]

            Hide Count Output If Zero

            Mohammad11th April 2021 at 6:01pm
            solution

            Also:

            Hide Part of Text

            Mohammad11th April 2021 at 6:01pm
            solution
            How to hide part of text in a tiddler?
            There several ways, commenting, using css

            Solution i

            Using the html commenting

            <!--
            My text I want to hide
            -->

            Solution ii

            Use style and classes in wikitext.

            @@display:none;
            This is hidden text
            @@

            Solution iii

            Use html with inline styles.

            <div style="display:none;">
            This is hidden text.
            </div>

            Solution iv

            Here is other hide stuff tricks

            <$list filter="[{$:/config/debugmode}match[yes]]" variable=nul>
            some stuff that will only show when in debug mode
            
            </$list>

            Solution v

            Hide on demand (by Eric Shulman). This uses a button with reveal widget.

            <$button class="tc-btn-invisible" popup=<<qualify "$:/temp/popup">>>
            
            !heading text
            </$button>
            <$reveal type="nomatch" state=<<qualify "$:/temp/popup">> text="">
            
            section content goes here
            </$reveal>

            Hide Tags from Tagspill Drop down Menu

            Mohammad11th April 2021 at 6:01pm
            solution

            Also doc the recent Q&A by Eric on hidding the tag wrapper url: https://groups.google.com/d/msg/tiddlywiki/yKiksOA-omg/8LoMoaBOAgAJ

            This is a wonderful solution also by Eric:

            https://groups.google.com/d/msg/tiddlywiki/Rjx1qERJ0VI/YIlf46mXAAAJ

            Hide Username Date and Tags in Printing

            Mohammad11th April 2021 at 6:01pm
            solution
            Is it possible to hide the username, time stamp and tags in printed tiddlers?

            Put the following CSS syntax in a tiddler, tagged with $:/tags/Stylesheet:

            @media print {
                 .tc-subtitle {display:none;}
                 .tc-tags-wrapper {display:none;}
            }

            This small code will hide the tags wrapper and subtitle (includes username, modified date stam) from printing.

            Hierarchical Tag Tree

            Mohammad11th April 2021 at 6:01pm
            solution
            How a table of contents can be displayed as tree like with connected colorful branches?
            It needs a custom TOC macro and stylesheet

            List Tree has been developed by twMat a stylesheet to reshape a bullet list into tree like display. It can be used with the below customized macro from Mark S.

            Customised TOC macro

            Note that, the "toc2" is the macro you will need to create to get your tree like table of contents. Install the List Tree plugin if you haven't already. Then create a new tiddler and tag it $:/tags/Macro. Put in the following contents:

            \define toc-body2(tag,sort:"",itemClassFilter,exclude,path)
            <ul class="list-tree">
              <$list filter="""[all[shadows+tiddlers]tag<__tag__>!has[draft.of]$sort$] -[<__tag__>] -[enlist<__exclude__>]""">
                <$vars item=<<currentTiddler>> path={{{ [<__path__>addsuffix[/]addsuffix<__tag__>] }}} excluded="""[enlist<__exclude__>] -[<__tag__>]""">
                  <$set name="toc-item-class" filter=<<__itemClassFilter__>> emptyValue="toc-item" value="toc-item-selected">
                    <li class="xlist-tree">
                      <$list filter="[all[current]toc-link[no]]" emptyMessage="<$link><$view field='caption'><$view field='title'/></$view></$link>">
                        <<toc-caption>>
                      </$list>
                      <$macrocall $name="toc-body" tag=<<item>> sort=<<__sort__>> itemClassFilter=<<__itemClassFilter__>> exclude=<<excluded>> path=<<path>>/>
                    </li>
                  </$set>
                </$vars>
              </$list>
            </ul>
            \end
            
            \define toc2(tag,sort:"",itemClassFilter:" ")
            <$macrocall $name="toc-body2"  tag=<<__tag__>> sort=<<__sort__>> itemClassFilter=<<__itemClassFilter__>> />
            \end

            Usage

            To call the TOC with the title of the current tiddler, use:

            <$macrocall $name="toc2" tag=<<currentTiddler>>/>

            Horizontal Rules in WikiText

            22nd April 2021 at 6:56am
            WikiText

            You can include a horizontal rule with three or more dashes on their own on a line:

            How Check a Tiddler Exist

            Mohammad11th April 2021 at 6:01pm
            solution
            Note that I tried an alternative to your "[<newTitle>]  -[has[title]] -[[]]" filter, using "[<newTitle>!is[tiddler]]" instead, but it had the same problem.

            How Create a Plugin Library

            Mohammad11th April 2021 at 6:01pm
            solution
            Resources

            How display backtick inside a Code Segment

            Mohammad11th April 2021 at 6:01pm
            solution
            Backtic inside backticks

            Tiddlywiki uses the `backticks` to create code as wikitext. Sometimes it is needed to have a backtic inside a code segment.

            The solution is the use of double backticks to delineate a run of monospaced text. Using double backticks allows single backticks to occur in the intervening text.

            Example

            More info

            See Wikitext formatting

            How Exclude Some Indexes in Filter

            Mohammad11th April 2021 at 6:01pm
            datatiddler solution

            Assume the My Alert Class Dictionary data (dictionary) tiddler has the below content

            primary:x
            secondary:x
            info:x
            success:x
            warning:x
            danger:x
            light:x
            dark:x

            How use a filter to list all indexes except info and light?

            You can only do boolean subtract on an entire filter run – not inside a run.

            So this might work for the first part: [[My Alert Class Dictionary]indexes[]addprefix[bg-]]

            If you just wanted to remove info and light, then maybe this:

            [[My Alert Class Dictionary]indexes[]!prefix[info]!prefix[light]addprefix[bg-]]

            As an example see below:

            <$list filter="[[My Alert Class Dictionary]indexes[]!prefix[info]!prefix[light]addprefix[bg-]]" variable="alert-type">
            <<alert type>><br>
            </$list>

            How Prevent Resizing textarea

            Mohammad11th April 2021 at 6:01pm
            solution
            When an $edit-text widget is tagged 'textarea' we get a multi-line resizable text editor, how to prevent/disable resizing textarea?
            Use CSS property

            There’s a CSS property that lets you control resizability of text areas. This will disable resizing on all textareas:

            textarea {
            resize: none;
            }

            If it is desired to disable resizing a specified textarea then wrap it in a div element as below

            .mycls textarea {
            resize: none;
            }

            and use it as below

            <div class="mycls">
            <$edit-text tiddler="yourTid" field="your-field" tag="textarea"/>
            </div>

            How Sidebar Works

            Mohammad11th April 2021 at 6:01pm
            solution

            The sidebar is generated like this:

            <$list filter="[all[shadows+tiddlers]tag[$:/tags/SideBarSegment]!has[draft.of]]" variable="listItem">
            
            <$reveal type="nomatch" state=<<config-title>> text="hide"  tag="div">
            
            <$transclude tiddler=<<listItem>> mode="block"/>
            
            </$reveal>
            
            </$list>

            (See $:/core/ui/PageTemplate/sidebar).

            How Switch a Tag among Tiddlers

            Mohammad17th April 2021 at 10:31pm
            done exmp065 solution task

            Read this and see it would be solved

            How swith a tag among a set of tiddlers? Only one tiddler can have the tag at a time!
            The solution is to use select widget and an action macro

            The below example demonstrate how to switch a tag among set of tiddlers. The code has two parts

            1. select widget to choose one tiddler among set of tiddlers
            2. action macro to set tag to the selected tiddler and remove it from previous tiddler

            Here for this example, tag exmp065 between three tiddlers is switched. Only one tiddler has the tag at a time. The action macro called applyTag is as below

            \define applyTag()
            <!-- first remove tag -->
            <$list filter="[search:title[exmp065/data]tag[exmp065]]">
            <$fieldmangler>
            <$action-sendmessage $message="tm-remove-tag" $param="exmp065"/>
            </$fieldmangler>
            </$list>
            <!-- then add tag -->
            <$tiddler tiddler={{exmp065/state}}>
            <$fieldmangler>
            <$action-sendmessage $message="tm-add-tag" $param="exmp065"/>
            </$fieldmangler>
            </$list>
            </$tiddler>
            \end

            How Temporarily Show a Tiddler in Sidebar

            Mohammad11th April 2021 at 6:01pm
            solution
            How display a tiddler in sidebar without modifying it or tagging it with?
            Use a tab with input to select and transclude the tiddler

            Example

            The below tiddler creates a sidebar tab for displaying tiddler temporarily on the sidebar.

            • To give a try, simply open exmp116/sidebar and tag it with $:/tags/Sidebar. A new sidebar tab called Temporary will appear in the sidebar.
            • Enter the title of a tiddler and it will be shown under the edit textbox with a link to the displayed tiddler.
            Remarks
            the $edit-text widget gets the tiddler title from the user
            the $list widget checks if the entered title is existed
            if entered title is existed, a link to tiddler with its contentent will be displayed

            How to add a new tab to the sidebar

            15th April 2021 at 6:28pm
            Customise TiddlyWiki Learning

            在侧边栏菜单中创建一个新的页签:

            1. 创建一个条目,并设其标签为系统标签 $:/tags/SideBar
            2. 缺省情况下,条目名称用作页签的标题,但您可以使用 caption 字段替换之
            3. 若要定义的页签顺序,请使用 list-afterlist-before 字段,如同于 Tagging 所述的

            请注意,您可以通过使用标签 $:/tags/MoreSideBar 以同样的方式创建"更多"页签下的新页签。

            How to Add Images to Sidebar

            Mohammad11th April 2021 at 6:01pm
            solution
            What is the simple method to add an image, logo to sidebar"?
            The clean way is to create or add the content to a tiddler tagged with $:/tags/SideBarSegment

            Solution

            • just use the system tag $:/tags/SideBarSegment to introduce any new element like your image to the sidebar
            • click on a tag pill for $:/tags/SideBarSegment to change the order.

            This will just add the logo and leave the $:/SiteTitle intact, but if you then want to hide the title, change only its display in the sidebar (remove $:/tags/SideBarSegment tag on $:/core/ui/SideBarSegments/site-title), since the site title is used to construct the save filename, the tab title and more "leave it alone).

            How to Adjust the Tiddler Width

            Mohammad11th April 2021 at 6:01pm
            solution

            How to Download a Complete Wiki

            Mohammad11th April 2021 at 6:01pm
            solution
            Is there any simple way to provide a link to download a complete wiki?
            the standard html syntax provide such feature

            Using standard HTML syntax:

            Notes
            • The "targetname.html" is a suggested filename for saving the downloaded file. Some platforms may ignore this value and assign their own default filename.
            • If your browser is configured to "ask for filename", you will get a platform-specific dialog box that will allow you to change the filename and/or the folder in which the file will be stored.
            • Some older browser versions do not support use of the "download" attribute. See https://caniuse.com/#search=download for more info.
            Important
            This will not save recently edited and unsaved tiddlers.

            How to Group Untagged Tiddlers

            Mohammad11th April 2021 at 6:01pm
            solution

            How to Truncate Long String with Ellipsis

            Mohammad11th April 2021 at 6:01pm
            solution

            How to Write a Plugin

            Mohammad11th April 2021 at 6:01pm
            solution

            Some resources that might be helpful for writting new plugins in Tiddlywiki:

            Tinka plugin packager

            The Tinka plugin provides the ability to create and modify plugins in the browser, without requiring the use of Node.js.

            See https://github.com/TinkaPlugin/Tinka for the GitHub repo, and demo page at https://tinkaplugin.github.io/

            How to write Widgets

            Mohammad11th April 2021 at 6:01pm
            solution

            Chris Hunt did a nice walkthrough a few years ago:

            http://cjhunt.github.io/

            Bonus - it’s made with v5.0.7, which now seems ancient. But not much has changed since then, so I’d expect the material to still work.

            Alternatively, you could read through some of the core widgets in reverse order of complexity.

            https://github.com/Jermolene/TiddlyWiki5/tree/master/core/modules/widgets

            The “text" widget is a good place to start; it just renders a string of text provided as an attribute:

            https://github.com/Jermolene/TiddlyWiki5/blob/master/core/modules/widgets/text.js

            The “codeblock” is marginally more complex: it renders a <code>/<pre> pair to contain it’s rendered children:

            https://github.com/Jermolene/TiddlyWiki5/blob/master/core/modules/widgets/codeblock.js

            The “vars” widget introduces variable assignments:

            https://github.com/Jermolene/TiddlyWiki5/blob/master/core/modules/widgets/vars.js

            The “count” widget is a good example of a simple widget with a slightly more complicated refresh strategy: it only refreshes itself if the count has changed:

            https://github.com/Jermolene/TiddlyWiki5/blob/master/core/modules/widgets/count.js

            Finally, the “keyboard” widget is a simple example of a widget with an event handler:

            https://github.com/Jermolene/TiddlyWiki5/blob/master/core/modules/widgets/keyboard.js

            How Use Now Macro inside a Filter

            Mohammad11th April 2021 at 6:01pm
            solution

            How to list (with list-links) everything tagged with "myTag" that also begins with the current year and month (specifically in the format "YYYY.0MM.")

            • Solution

            Use a set widget and first store your desired date into a varaibale. Here the current year and month can be generated using the now macro as <<now YYYY.0MM.>>. Other date formats can also be used.

            <$set name="mydate" value=<<now YYYY.0MM.>> >
            <<list-links "[tag[myTag]prefix<mydate>]">>
            </$set>

            HowDnsWork

            28th April 2021 at 11:18am
            DNS

            HowToCreateContentTree

            11th April 2021 at 6:26pm

            After you create your custome sidebar,create one tiddler as the first level directory tiddler,the tag name is tittle name of created sidebar tiddler ,then create a group of tiddle as you need,these tag name of this group of tiddler should be the tittle name of first level tiddler.

            1. create a sidebar tiddler ,this tidder can look as the root directory
            2.create a tiddler as the first level directory of the root directory that you created in step one
            3.you can create a lot of tiddler ,you only keep the tag name the same as the tittle of first level directory tiddler .
            * what you do to make a content tree is same as you create directory and subdirectory and files under windows system。

            HowToCreateCustomeSideBar

            15th April 2021 at 6:29pm
            HowToCustomeTiddlyWiki

            create a new tiddler,tag must set to be $:/tags/SideBar,then text of the new tiddler copy and paster below coder:

            <div class="tc-table-of-contents">
            <<toc-selective-expandable 'YourContentsName' sort[title]>>
            </div>
            

            and title of this tiddler must be YourContentsNmae。

            after create sidebar tiddler,you can create a new tiddler as the child tiddler of the sidebar tiddler.How can this do the right work? you only need to named the tag of this child tiddler the same with the title of the sidebar tiddler ,the title of this child tiddler you create is freely for your need.

            HTML

            21st April 2021 at 9:57pm
            Web

            HTML in WikiText

            22nd April 2021 at 6:56am
            WikiText

            HTML tags and comments can be used directly in WikiText. For example:

            <article class="hello">
            This is my nice and simple block of text. HelloThere
            <!-- This comment will not appear in the wikified output -->
            </article>

            Widgets share the same syntax as HTML tags, and so the following information applies to them, too.

            Block mode versus Inline mode

            To get the content of an HTML element to be parsed in block mode, the opening tag must be followed by two linebreaks.

            Without the two linebreaks, the tag content will be parsed in inline mode which means that block mode formatting such as wikitext tables, lists and headings is not recognised.

            Self closing elements

            The following tags are treated as 'void'. This means that <tag> is treated as if it were <tag/>, and that no terminating </tag> is needed (if one is provided it will be ignored and treated as plain text).

            • <area>, <base>, <br>, <col>, <command>, <embed>, <hr>, <img>, <input>, <keygen>, <link>, <meta>, <param>, <source>, <track>, <wbr>

            If you don’t close any other tag then it will behave as if the missing closing tag were at the end of the tiddler.

            Attributes

            In an extension of conventional HTML syntax, attributes of elements/widgets can be specified in several different ways:

            Literal Attribute Values

            Literal attribute values can use several different styles of quoting:

            • Single quotes (eg attr='value')
            • Double quotes (eg attr="value")
            • Tripe double quotes (eg attr="""value""")
            • No quoting is necessary for values that do not contain spaces (eg attr=value)

            Literal attribute values can include line breaks. For example:

            <div data-address="Mouse House,
            Mouse Lane,
            Rodentville,
            Ratland."/>

            By using triple-double quotes you can specify attribute values that contain single double quotes. For example:

            <div data-address="""Mouse House,
            "Mouse" Lane,
            Rodentville,
            Ratland."""/>

            Transcluded Attribute Values

            Transcluded attribute values are indicated with double curly braces around a TextReference. For example:

            attr={{tiddler}}
            attr={{!!field}}
            attr={{tiddler!!field}}

            Variable Attribute Values

            Variable attribute values are indicated with double angle brackets around a macro invocation. For example:

            <div title=<<MyMacro "Brian">>>
            ...
            </div>

            Filtered Attribute Values

            Filtered attribute values are indicated with triple curly braces around a Filter Expression. The value will be the first item in the resulting list, or the empty string if the list is empty.

            This example shows how to add a prefix to a value:

            <$text text={{{ [<currentTiddler>addprefix[$:/myprefix/]] }}} />

            Html5 Date Attribute

            Mohammad11th April 2021 at 6:01pm
            solution

            The new html5 date attribute example

            Html5 Detail Tag

            Mohammad11th April 2021 at 6:01pm
            html5 solution

            The HTML Details Element (<details>) creates a disclosure widget in which information is visible only when the widget is toggled into an "open" state. A summary or label can be provided using the <summary> element.

            Html5 Forms Elements

            Mohammad11th April 2021 at 6:01pm
            html5 solution task

            The below example shows some html5 form features.

            If Field Macro

            Mohammad11th April 2021 at 6:01pm
            solution

            The below macro proposed by Tony in Forum and modified by Mark S

            Code

            \define if(fieldname test do)
            <$list filter="[is[current]field:$fieldname$[$test$]]" variable="null">
            $do$
            </$list>
            \end

            It can do something against the contents of a field in the currentTiddler.

            • fieldname: the name of field in current tiddler
            • test: the content of filed
            • do: string of what to be done

            Example

            <<if note "Hi Mohammad" do:"""
            
            Hello, your note field contains Hi Mohammad!
            
            * Hi
            * Mohammad
            
            """>>

            Results in:

            Hello, your note field contains Hi Mohammad!

            • Hi
            • Mohammad

            If Then Else

            Mohammad11th April 2021 at 6:01pm
            solution

            This macro offers a solution for simple if-then-else text generation.

            It presents some added value compared to the reveal widget: it accepts variables as well as transclusions and it can show an error message.

            If Then Else Action Macro

            Mohammad11th April 2021 at 6:01pm
            macro solution

            The below simple macro can do different things based on the filter content. It uses a list widget, if the filter run has some output then the ifyes part is run if the filter result is empty then the ifno part will be run.

            Input parameters

            • filter: a standard TW filter
            • ifyes: a macro to be run if filter output is NOT empty
            • ifno: a macro to be run if filter output IS empty

            Code

            \define if(filter,ifyes,ifno)
            <$list filter="""$filter$ +[limit[1]]""" emptyMessage=<<$ifno$>>>
            <<$ifyes$>>
            </$list>
            \end
            \define ifyes() YES!
            \define ifno() NO!

            Example

            <<if "[title[GettingStarted]] +[has[title]]" ifyes ifno>>

            IfError与Vlookup的配合

            19th April 2021 at 9:05pm
            Excel
            • 在单独使用Vlookup比对查询时,如果查询不到合适的数据,vlookup()函数就返回一个错误值,电子表格中显示一串错误信息作为查询结果,这样会让最后的结果表可读性不好,还需要使用批量的查询和替换来替换错误信息为指定的数据。
            • 把Vlookup()的返回值作为IfError(value,value-if_false)的第一个参数,如果value为错误的值,则第二个参数的值就是IfError()函数的值;如果value为正确的值,则value就是IfError()函数的返回值,也就是Vlookup()函数正确匹配的数据。
            • IfError(value,value-if-error),用来判断value的正确性,如果value正确则返回value,否则返回value_if_error。

            Iframe and Tiddlers Contains a Html Page

            Mohammad11th April 2021 at 6:01pm
            exmp032 solution

            I have a plain text tiddler, that contains a HTML page including head and body, javascript, including libraries etc... How is it possible to load it through iframe?

            Example

            The Example 32: Test.html contains HTML page. Using iframe as below it is possible to laod it.

            Image with Tooltip

            Mohammad11th April 2021 at 6:01pm
            solution

            Image with tooltip

            <<image pig.png 64>>

            Hover mouse on image

            Images in WikiText

            22nd April 2021 at 6:56am
            WikiText Working with TiddlyWiki

            Image Formatting

            Images can be included in WikiText with the following syntax:

            [img[Motovun Jack.jpg]]
            [img[https://tiddlywiki.com/favicon.ico]]

            You can also insert images from the editor toolbar. Click picture () and select a picture file.

            If the image source is the title of an image tiddler then that tiddler is directly displayed. Otherwise it is interpreted as a URL and an HTML <img> tag is generated with the src attribute containing the URL.

            A tooltip can also be specified:

            [img[An explanatory tooltip|Motovun Jack.jpg]]

            Attributes can be provided to specify CSS classes and the image width and height:

            [img width=32 [Motovun Jack.jpg]]
            [img width=32 class="tc-image" [Motovun Jack.jpg]]

            Note that attributes can be specified as transclusions or variable references:

            [img width={{!!mywidth}} class=<<image-classes>> [Motovun Jack.jpg]]

            The image syntax is a shorthand for invoking the ImageWidget.

            Displaying Images via Transclusion

            You can also display an image stored in a tiddler by transcluding that tiddler. The disadvantage of this approach is that there is no direct way to control the size of the image.

            {{Motovun Jack.jpg}}

            Renders as:

            Images as Links

            <$link to="HelloThere" tooltip="Custom tooltip">{{$:/core/icon}}</$link>

            Renders as:

            Importing Images

            Use the button (under the tab in the sidebar), or drag and drop. See ImportingTiddlers for details.

            ImagesInTiddlyWiki-1

            25th April 2021 at 11:59am
            images

            apart from including images from tiddlywiki inner ,using ext can also transclude img from website of internet ,such as githut.com .see example below:

            ImageWidget

            11th April 2021 at 6:01pm
            MyOwn

            Any content of the <$image> widget is ignored.

            AttributeDescription
            sourceThe URL of the image, or the title of an image tiddler
            widthThe width of the image
            heightThe height of the image
            tooltipThe tooltip to be displayed over the image
            altThe alternative text to be associated with the image
            classCSS classes to be assigned to the <img> element

            The width and the height can be specified as pixel values (eg "23" or "23px") or percentages (eg "23%"). They are both optional; if not provided the browser will use CSS rules to size the image.

            External Images and the _canonical_uri field

            When used to display tiddler-based images, the image widget operates in two distinct modes:

            • If the _canonical_uri field is present then it is used as the src attribute of the generated <img> element and the text field is ignored
            • Without the _canonical_uri field, the image widget generates an <img> element that embeds the image data directly using a data: URI.

            See ExternalImages for more details.

            img0007.jpg

            Img002.jpg

            Import JSON Tiddler

            Mohammad11th April 2021 at 6:01pm
            solution

            TiddlyWiki can import JSON files, but only if the 'records' in the file contain certain field names. Most important, each JSON record must have a uniquely-valued title field. This is used to create the corresponding tiddler. The remaining field names in the JSON record can be anything you like. However, keep in mind that certain field names have special meanings in the TWCore system.

            Specifically, title, text, tags, created, creator, modified and modifier should be considered not be used as general-purpose field names.

            Also note that the TWCore's JSON processing does not handle complex nested JSON structures... just plain name/value pairs within a simple list of top level objects.

            Here's an example of a simple JSON file that can be imported to create tiddlers:

            [
                {
                    "title": "TiddlerTitleGoesHere",
                    "text": "Tiddler content here",
                    "tags": "Tiddler tags here",
                    "foo": "This is a field named foo",
                    "bar": "This is a field named bar"
                },
                {
                    "title": "AnotherTitle",
                    "text": "Tiddler content here",
                    "tags": "Tiddler tags here",
                    "foo": "This is a field named foo",
                    "bar": "This is a field named bar"
                }
            ]
            

            Index&Match

            11th April 2021 at 6:01pm
            Excel

            Excel中Index 和 Match的联用 通过一项关联的数据, 从另外一个表中向当前表中获取数据,可以使用index函数和match函数联用来实现。 index(要获取的数据所在的数据区域,row)

            一句话就是在指定的列区域(一般是一列)按照行号进行索引,第一个参数就是指定的列区域,一般用$进行固定; 第二个参数是通过关联字段找到对应的行号。 而index()中的row如何获取呢?可以通过match()函数来返回。将当前表中的关联的数据项代入到match() ,在目标表中对应数据区域中找到相同的数据,然后由match()返回对应的行数。 注意三个要点: 1、index()函数的第一个参数。index()函数的第一个参数是指定一个要获取的数据的区域(比如表格中的姓名列)。要获取的数据区域表示方法: Sheet2!$b$2:$b$200 ,是指从表二中的B列第二行到第200行的一个数据区域。 2、match(参数1,参数2,参数3)。参数1是当前表中和目标表之间关联的数据项,比如两个表中都有身份证号且唯一,就可以通过身份证号作为关联数据项。简单的说,参数1就是当前表中的关联数据项,参数2是目标表格中的一个指定区域,用来和参数一进行关联的区域,比如身份证号区域。) 参数2是目标表中要关联的数据所在的一个数据区域,比如身份证号所在的数据区域: Sheet2!$c$2:$c$200 。简言之,就是在目标表中指定的数据区域中查找身份证号(或任何关联数据)。 参数3是指定match函数的查询方式,一般默认为0就可以。 3、关于数据格式问题。一般由应用程序从数据库中导出的数据包特定功能格式,在书写公式时可能会导致会出错,因此可以点击表格左上角的全选按钮,然后点击编辑|清除菜单下的[格式]菜单项,可以清除表格中特定的格式,这样在写公式时就不会因为格式问题而出错。

            有了这三条,就可从数据库中导出表格,在任意两个可关联的表格之间获取数据。

            最重要的一条:如果index()公式失效,那么最大的可能就是关联的数据包含空格,选中整列数据,使用查找替换替换掉空格就好了

            Inject or Import Tiddlers through Bookmarklets

            Mohammad11th April 2021 at 6:01pm
            exmp100 solution
            Does Tiddlywiki exports tiddlers as bookmarklet?
            Yes, Tiddlywiki macros can be used to create bookmarklet.
            How create a bookmarklet to inject tiddlers into a Tiddlywiki?
            The below macros create a bookmarklet with tiddlers selected through a filter.

            Macros

            The below code contains two macros:

            • the main macro save-as-bookmarklet
            • the helper macro save-as-bookmarklet-href

            How to use

            • In a wiki you want to create bookmarklet call the macro save-as-bookmarklet with desired title and filter like

              This will create a bookmarklet link

            • Drag the bookmarklet link to the browser bookmark bar to install it and create a new bookmark. Note the title of bookmark will be the same as you selected at previous step
            • Visit another TiddlyWiki. Clicking the bookmarklet will inject the payload tiddlers into the target wiki.

            Installing a plugin from the plugin library

            21st April 2021 at 6:45pm
            FromTiddlerWiki

            Standalone Configuration

            Follow these instructions when using TiddlyWiki as a standalone HTML file:

            1. Create a backup of your current TiddlyWiki HTML file (just in case)
            2. Open your TiddlyWiki in a browser
            3. Open the control panel , click on the Plugins tab and then the Get more plugins button
            4. Click open plugin library to open the official plugin library
            5. When the library listing is loaded:
              1. Use the tab to select between plugins, themes and languages
              2. Use the search box to search the plugin details
            6. Click the install button to install a plugin
            7. Save your TiddlyWiki
            8. If a yellow warning bar appears at the top of the window, refresh the window so that TiddlyWiki completes installation of the plugin
              • It is no longer necessary to refresh TiddlyWiki when deleting plugins that support dynamic loading. See PluginMechanism for more details
            9. The plugin should now be available for use

            Client-Server Configuration

            Follow these instructions when using TiddlyWiki under Node.js:

            1. Identify the plugins you want to install using the Plugins tab of control panel (don't install the plugins from here, though). Plugins are identified by their type (ie language, theme or plugin) and their publisher and title. For example, the plugin $:/plugins/tiddlywiki/internals is referred to as tiddlywiki/internals
            2. Quit the server if it is running
            3. Edit the tiddlywiki.info file (it is in JSON format) and locate the plugins, themes or languages section (see below)
            4. Add entries corresponding to the plugins you wish to add. Take care to retain commas to separate items, but do not terminate the last item in a list with a comma
            5. Restart the server
            {
            	"plugins": [
            		"tiddlywiki/codemirror"
            	],
            	"themes": [
            		"tiddlywiki/vanilla",
            		"tiddlywiki/snowwhite"
            	],
                "languages": [
                    "es-ES",
                    "fr-FR",
                    "en-EN"
                ]
            }

            See also Installing custom plugins on Node.js.

            Intersection of Two Filter Expression

            Mohammad11th April 2021 at 6:01pm
            solution
            How to find the intersection of two filter run?
            Use the Venn diagram

            Example i

            \define f1() [enlist<x>]-[enlist<y>]
            \define f2() [enlist<y>]-[enlist<x>]
            
            <$vars
             x="1 2 3 4 5"
            
             y= "2 7 9 3"
            
             >
            <$list filter="[enlist<x>] [enlist<y>] -[subfilter<f1>] -[subfilter<f2>]" variable=item>
            <<item>>
            </$list>
            </$vars>

            Example ii

            This solution can be used for any filter run, but may be not as efficient as above solution, because it has many macro call.

            \define intersect-item(filter, item)
            <$list filter="[<__item__>] -[subfilter<__filter__>]" variable="result" emptyMessage=<<__item__>> >
            </$list>
            \end
            
            \define intersect(flt1, flt2)
            <$list filter=<<__flt2__>> variable=item >
            <$macrocall $name="intersect-item" filter=<<__flt1__>> item=<<item>> />
            </$list>
            \end
            
            <$vars
             x="7 8 -1 -3 9 11"
             y= "1 2 3 4 5 6 7 8 9"
             >
            <$macrocall $name=intersect 
               flt1="[enlist<x>]"
               flt2="[enlist<y>]"
            />
            </$vars>

            Introduction to Tiddlywiki

            Mohammad11th April 2021 at 6:01pm
            solution

            Introduction to Tiddlywiki is a presentation made by Jeremy Ruston. It uses a new theme

            Iterate DataTiddler Indexes

            Mohammad11th April 2021 at 6:01pm
            exmp039 solution
            How to list all properties (index/value pairs) of a DataTiddler into a table?

            This example is similar to Listing DataTiddler Properties and use the same DataTiddler.

            Java

            11th April 2021 at 6:01pm
            MyContents

            JavaScript

            21st April 2021 at 9:57pm
            Web

            Javascript Macro

            Mohammad11th April 2021 at 6:01pm
            solution
            How to develop a JavaScript macro?

            There are two separate cases here:

            1. Being able to use custom javascript code to do calculations and other logic
            2. Loading the code "on-the-fly"

            As has been noted, (2) is problematic from a security standpoint... so let's just ignore that and focus on (1)...

            Fortunately, the solution is already provided by the TWCore. You can use

            https://tiddlywiki.com/dev/#JavaScript%20Macros to define custom javascript functions that are loaded during startup processing (just like plugins).

            Then, after startup, these javascript functions can be invoked from within tiddler content using the standard macro syntax (e.g., <<myMacro arg1:"foo" arg2:"bar">> or <$macrocall $name="myMacro" ... />.

            In addition, just like the definition of regular in-line macros (created using \define foo(...)), a javascript macro's "job" is simply to generate and return content for further rendering by the TWCore engine.

            A good example of a simple javascript macro can be found here:

            https://tiddlywiki.com/#%24%3A%2Fcore%2Fmodules%2Fmacros%2Fnow.js

            This code shows the definition of the TWCore's <<now>> macro, which accepts one optional parameter – a datetime format – and returns the corresponding datetime text as it's result.

            In addition to the <<now>> macro, there are several other javascript macros of varying complexity that are part of the TWCore. Use to search the *shadow* tiddlers for "core/modules/macros" and you will see about a dozen results for you to study.

            Jekyll写博客

            5th May 2021 at 4:12pm
            博客
            1. 使用GitHub之前有必要学习一下git,廖雪峰的Git教程就很好。使用github pages就去看它的官方文档,在看看jekyll的官方文档。使用jekyll初始化一个博客工程后,就算是搭建好博客了。说30分钟搭建好指的是安装jekyll环境,到初始化成功,在本地4000端口上可以运行。初始的博客非常简陋,需要自己重新设计界面,添加交互等。这些后续的工作可能会持续1-2个月,最后使博客稳定下来。你要有HTML,css,JavaScript基础。在去了解一下jekyll的liquid语法。
            2. markdown语法2个小时就掌握了。jekyll是个博客引擎。
            3. 建议使用git命令行,github客户端就是坑。fork的目的是为了给原作者提供代码贡献,为了pullrequest的。再说一遍,不要使用github客户端,我被坑过不知一次。
            4. 是因为你没有安装jekyll环境,github官方是提供这个服务环境的,所以通过github可以正常浏览,本地不行。安装好环境后,通过4000端口就可以浏览了。
            5. 不要使用github客户端。
            6. 在本地编辑,直接修改post文件夹下的Markdown文件,具体可以看jekyll官网的说明。
            7. 启动好jekyll后,在localhost:4000上看,就应该是正常的,不要直接打开html文件。
            8. 编译后的效果问题,你误删了css文件?或者不小心把head中的标签修改了?总之是css样式不对。

            还有最关键的一点,搭建好博客后,如果使用的别人的模板,记着修改掉这些东西: ·统计代码。如百度统计或者google统计,这样避免麻烦原博主屏蔽一些别的来访id。 ·评论代码。找到别人博客的评论代码,如disqus代码,或者多说评论的代码,否则你的评论会在别人的评论后台提示,自己却看不到提示。 ======== 去看jekylI英文的官方文档吧,原汁原味的最适合你。中文的抄来抄去,真的不如静下来去看看官方的英文文档。

            LearningTiddlyWiki

            11th April 2021 at 6:01pm
            MyContents

            LearnWikiText

            22nd April 2021 at 7:16am
            WikiText

            Line break in Filters Attributes

            Mohammad11th April 2021 at 6:01pm
            solution
            Why linebreaks cause filter not work?

            Joe Armstrong asked why the below code with pattern A works, but with pattern B does not work?

            Why linebreaks cause the code stop working?

            • Pattern A
            <$set name="username" value={{$:/status/UserName}} emptyValue="(anonymous)">
            <$set name="target" filter="[<currentTiddler>]">
            <$action-createtiddler 
                $basetitle={{{ [[Comment by ']] +[addsuffix<username>] +[addsuffix[' on ' ]] +[addsuffix<currentTiddler>] +[addsuffix[']] }}} 
                  role="comment" list=<<target>> text="" edit-mode="yes"/>
            </$set>
            </$set>
            • Pattern B
            <$set name="username" 
                       value={{$:/status/UserName}} 
                       emptyValue="(anonymous)">
              <$set name="target" 
                         filter="[<currentTiddler>]">
                <$action-createtiddler 
                    $basetitle={{{ [[Comment by ']] 
                                            +[addsuffix<username>] 
                                            +[addsuffix[' on ' ]] 
                                            +[addsuffix<currentTiddler>] 
                                            +[addsuffix[']] }}} 
                    role="comment"
                    list=<<target>> 
                    text="" 
                    edit-mode="yes"/>
                </$set>
            </$set>

            Answer

            • The first pattern is not readable and error prone.
            • The second pattern is readable.
            • Although filters accept newlines as whitespace, the filtered attribute parser does not accept newlines. Thus this example does not work unless the newline is removed.

            See GitHub Ticket 3692

            Link to a PDF File on a Specific Page

            Mohammad11th April 2021 at 6:01pm
            exmp026 solution
            How to open a PDF file from inside TW and go to a specific page
            [ext[your-label|pdf-file-address#page=pg-number]]
            • Example
            [ext[Math book|archive\books\math.pdf#page=4]]

            See demos:

            link to ext pdf and like that

            Mohammad11th April 2021 at 6:01pm
            solution task

            Linking in WikiText

            22nd April 2021 at 6:56am
            WikiText

            A key capability of WikiText is the ability to make links to other tiddlers or to external websites.

            Manual Links

            Link to a tiddler by title:

            [[Tiddler Title]]

            To link to a tiddler and specify the text of the link:

            [[Displayed Link Title|Tiddler Title]]

            You can also create a link from the editor toolbar. Click link (), and search and select a tiddler.

            ~CamelCase Links

            For tiddler titles that match the CamelCase rules, just typing the title without double square brackets will automatically create a link.

            You can suppress a link from being recognised by preceding it with ~. For example:

            External Links

            To link to an external resource such as a website or a file, type its full URL, including the URI scheme such as a protocol (e.g. http://, file://) or mailto:

            https://tiddlywiki.com/
            
            [[TW5|https://tiddlywiki.com/]]
            
            [[Mail me|mailto:me@where.net]]
            
            [[Open file|file:///c:/users/me/index.html]]

            For this syntax to work, the URL has to be recognisable as a URL. Otherwise, it is treated as a tiddler title. As a result, in case you want to link to a resource locatable using a relative path, use the extended syntax:

            [ext[Open file|index.html]]
            
            [ext[Open file|./index.html]]
            
            [ext[Open file|../README.md]]
            
            [ext[Open file|c:\users\me\index.html]]

            The extended syntax still works with full URLs, although in that case it is not necessary:

            [ext[https://tiddlywiki.com]]
            
            [ext[TW5|https://tiddlywiki.com]]
            
            [ext[Mail me|mailto:me@where.net]]
            
            [ext[Open file|file:///c:/users/me/index.html]]

            You can also use the extended syntax to force an external link:

            [ext[Donate|bitcoin:1aabbdd....?amount=0.001]]

            Customising Tiddler Links

            See the LinkWidget for details of the underlying widget used to implement tiddler links, including macros that can be used to customise its behaviour.

            LinkingInWikiText

            21st April 2021 at 6:48pm
            FromTiddlerWiki

            A key capability of WikiText is the ability to make links to other tiddlers or to external websites.

            Manual Links

            Link to a tiddler by title:

            [[Tiddler Title]]

            To link to a tiddler and specify the text of the link:

            [[Displayed Link Title|Tiddler Title]]

            You can also create a link from the editor toolbar. Click link (), and search and select a tiddler.

            ~CamelCase Links

            For tiddler titles that match the CamelCase rules, just typing the title without double square brackets will automatically create a link.

            You can suppress a link from being recognised by preceding it with ~. For example:

            External Links

            To link to an external resource such as a website or a file, type its full URL, including the URI scheme such as a protocol (e.g. http://, file://) or mailto:

            https://tiddlywiki.com/
            
            [[TW5|https://tiddlywiki.com/]]
            
            [[Mail me|mailto:me@where.net]]
            
            [[Open file|file:///c:/users/me/index.html]]

            For this syntax to work, the URL has to be recognisable as a URL. Otherwise, it is treated as a tiddler title. As a result, in case you want to link to a resource locatable using a relative path, use the extended syntax:

            [ext[Open file|index.html]]
            
            [ext[Open file|./index.html]]
            
            [ext[Open file|../README.md]]
            
            [ext[Open file|c:\users\me\index.html]]

            The extended syntax still works with full URLs, although in that case it is not necessary:

            [ext[https://tiddlywiki.com]]
            
            [ext[TW5|https://tiddlywiki.com]]
            
            [ext[Mail me|mailto:me@where.net]]
            
            [ext[Open file|file:///c:/users/me/index.html]]

            You can also use the extended syntax to force an external link:

            [ext[Donate|bitcoin:1aabbdd....?amount=0.001]]

            Customising Tiddler Links

            See the LinkWidget for details of the underlying widget used to implement tiddler links, including macros that can be used to customise its behaviour.

            Linux

            11th April 2021 at 6:01pm
            MyContents

            List All Fields and Count Them

            Mohammad11th April 2021 at 6:01pm
            solution
            How to list all fields in a wiki and display the number of tiddlers with that field?
            Use the fields filter operator to get the all fields and then use a nested list widget to count them.

            Solution

            The below code is one possible solution.

            <$list filter="[all[tiddlers+shadows]fields[]sort[]]" variable="field">
            <$list filter="[all[tiddlers+shadows]has:field<field>count[]]" variable="count">
            <<field>> : <<count>> <br/>
            </$list>
            </$list>

            Remarks

            • The [all[tiddlers+shadows]fields[]sort[]] in the first $list widget retrieves
              • fields from all tiddlers
              • and sort them
            • The second list widget with [all[tiddlers+shadows]has:field<field>count[]] filter
              • finds tiddlers with specific field name (has:field<field>)
              • and counts it using count[]

            Example

            The below example displays all fields in this wiki (TW-Scripts).

            List all Tiddlers Created in x Days

            Mohammad11th April 2021 at 6:01pm
            solution

            Show all system tiddlers that you have created in the last x days!

            List All Tiddlers Created or Modified in Last x Days

            Mohammad11th April 2021 at 6:01pm
            solution
            How to list all tiddlers modified in the last x days?
            Use days operator.

            As described in Days Operator Select tiddlers where a specified date field (default "modified") is within a specified date range. Time portion is ignored.

            Example i

            List all tiddlers tagged with solution and modified within the last two days.

            Example ii

            List all tiddlers tagged with solution and created within the last two days.

            !! Remarks * The last example only shows newly created tiddlers tagged with solution * Note to the days:created[-2] and the created suffix. * Compare the two examples, one list recent modified and the other lists recent created tiddlers tagged with solution.

            For more information see days operator

            List and Transclude Tiddlers with Today Date

            Mohammad11th April 2021 at 6:01pm
            solution
            How all tiddlers their title started with today date cane be listed and transcluded?
            The macro can be used with a operator as below:
            <$set name="today" value= <<now YYYY-0MM-0DD>> >
               <$list filter="[prefix<today>]">
                  <$view field="title"/><br>
                  <$transclude /><br>
               </$list>
            <$set>

            List by Common Fields

            Mohammad11th April 2021 at 6:01pm
            exmp110 solution
            How one can list all tiddlers have common fields?
            Common field here means a field all tiddlers have it. There is no direct operator to return common fileds and it needs nested loop.

            Example

            • Consider you have several tiddlers all tagged with myTag
            • These tiddlers have different fields like fa, fb, fc, fd, etc...
            • Not all of them have all above fields But all of them have common fields means all have for example fb, and fd
            • How one can list and display the common fields only? (here fb, and fd)

            Code

            The below code implements the above example.

            Remarks

            • The first $vars gets the number of tiddlers tagged with myTag
            • The first $list retrives all the fileds in selected tiddlers here all tiddlers tagged with myTag
            • The second $vars counts the number of tiddlers have the thisField which refer the fileds retrived one by one in first $list
            • The $reveal compare the total number of tiddlers and the number of tiddlers have thisField, if they are equal the field is shown

            List by Tag but Sort and Show by Field Value

            Mohammad11th April 2021 at 6:01pm
            exmp056 solution
            How to list all tiddlers tagged with say myTag and sort them by a specified field value and show those value
            Use a $list widget with get and sort operator

            Example

            The below code list all tiddleers tagged with fruit and sort them by the value of nameit field and show those values. (See exmp056 tiddlers)

            See also Create a Doubly Sorted Table

            List Contact Tiddlers Based on a Category

            Mohammad11th April 2021 at 6:01pm
            exmp001 solution

            List contacts based on specified categories

            The following code lists contact tiddlers (tagged with contact) based on second tag as category. The categories are stored in Circles tiddler.

            • Tiddler contents

            • Notes

            The thing to remember is that the brackets go with the TYPE of operand....

            • [foo] is a literal value
            • <foo> is a variable reference
            • {{!!foo}} is a reference to filed foo in current tiddler
            • {someTiddler} is a reference to the text filed of someTiddler
            • {SomeTiddler!!foo} is a reference to the value of the "foo" field in tiddler "someTiddler"
            • Output
            <$list filter="[list[Circles!!text]]" variable="item">
            
            !! <<item>>
            <<<
            <$list filter="[tag[contact]tag<item>]">
            
            </$list>
            <<<
            </$list>

            List filter with empty tiddler values

            Mohammad11th April 2021 at 6:01pm
            solution

            List Results into Hardcopy

            Mohammad11th April 2021 at 6:01pm
            solution
            How is it possible to write down the result of filtered list into another tiddler as harcopy (static text)?

            I'd like to make a button that allows me to create a "hard copy" of the list into a tiddler in the sense that you could open the tiddler file in another program and just see the list there, i.e. in the form of a normal text file.

            Solution

            The below code list all tiddler' tagged with Learning and then uses a button to write their conents into a tiddler called myErrands as a harcopy (static text).

            \define mymegatext()
            <$list filter="[tag[Learning]limit[20]]">
            <$view field=text/>
            </$list>
            \end
            \define mybutton()
            <$wikify name=mytext text=<<mymegatext>>>
            <$action-setfield 
            $tiddler="myErrands"
               tags="hardcopies"
            text=<<mytext>>
            />
            </$wikify>
            
            \end
            
            <$button actions=<<mybutton>> >
            set Errands
            </$button>

            This way it is possible to merge several tiddlers into one. Like merging all tiddlers tagged with $:/tags/Stylesheet and export the resulted tiddler to compress using a CSS online minifier.

            List the Last Ten Modified Tiddlers

            Mohammad11th April 2021 at 6:01pm
            exmp031 solution

            How to list the last 10 modified tiddlers in reverse order? It means

            • Only show the last 1o tiddlers modified or created
            • List the last modified/created one first
            <<list-links "[has[modified]!sort[modified]limit[10]]" type:"ol">>

            See Example 31: List Few Last Modified Tiddlers

            Thomas Elmiger solution

            Thomas Elmiger in TW Google group pointed out that, you want to minitor the lasted changes, but usually don’t need state tiddlers and temporary info (often set by the system, not by the user), so you can use the below filter:

            [!prefix[$:/state]!prefix[$:/temp]![$:/StoryList]![$:/HistoryList]haschanged[]!sort[modified]]

            This shows modifications from the current session (see https://tiddlywiki.com/#haschanged%20Operator).

            and

            [has[modified]!prefix[$:/state]!prefix[$:/temp]!sort[modified]limit[50]]

            ... nearly the same as above.

            See also

            1. Export Latest Changes in Current Session

            List Tiddler Tags Based on a Field

            Mohammad11th April 2021 at 6:01pm
            exmp021 solution

            There as a question by bimlas on using a stored variabe value in other scopes.

            Mark S gave a neat solution as below (I have modified it for minor issues)

            \define mytiddlerslist()
            <$list filter="[has[myfield]tags[]]"><$view field=title/> </$list>
            \end
            <$wikify name="mytiddlers" text=<<mytiddlerslist>>>
            <$list filter="<mytiddlers>" variable="v"><<v>></$list>
            </$wikify>

            This means using a macro the same variable can be used in different scope. A working example based on this has been given in Example 21: List Tags Based on a Field. It that all tiddlers with a responder filed are listed and then their tags are displayed using a list widget in another scope.

            List Tiddlers with Their Tags as Tagpill

            Mohammad11th April 2021 at 6:01pm
            solution
            How we can list tiddlers based on a tag with their other tags as tagpill?
            It can be done using nested list widget and ~TagTemplate as below
            \define showtagsaspills(hidetagfilter)
            <$set name=tagfilter value={{!!tags}}$hidetagfilter$>
            <$list filter=<<tagfilter>> >
              {{||$:/core/ui/TagTemplate}}
            </$list>
            </$set>
            \end
            
            <$list filter="[tag[exmp001]]" >
            <li><$link to={{!!title}} tooltip="Custom tooltip eg open tiddler">{{!!title}}</$link> <<showtagsaspills>></li>
            </$list>
            • Example

            List Widget and Switch Case Construct

            Mohammad11th April 2021 at 6:01pm
            solution
            Using the new operator in TW5.1.20, how is it possible to create a Switch-Case construct using the $list widget?
            Using the match operator with the else ~

            Example

            <$list filter="[<casevariable>] ~[[false]]" variable=case>
               <$list filter="[<case>match[false]]" variable=case>
                    Do this if no case value
               </$list>
               <$list filter="[<case>match[caseone]]" variable=case>
                    Process "caseone"<br>
               </$list>
               <$list filter="[<case>match[casetwo]]" variable=case>
                    Process "casetwo"<br>
               </$list>
               <$list filter="[<case>match[casethree]]" variable=case>
                    Process "casethree"<br>
            
               </$list>
            <!-- Even this -->
               <$list filter="[<case>match[casetwo]] [<case>match[casethree]]" variable=case>
                    Process "casetwo" and "casethree"<br>
               </$list>
            </$list>

            Remarks

            • The outter $list widget is the main $list
            • All the inner $list widgets are the second $list widget
            • The main $list widget recieves a filter, if it is non-empty it will result a value
            • If the value is caseone, casetwo or casethree then the related second $list widget will be run
            • If the first $list widget returns no value then the ~[[false]] will resulst in false value and so, the related second $list widget will be run

            In summary the above construct simply represent the switch-case-default construct in C language.

            Lists in WikiText

            22nd April 2021 at 6:56am
            Lists WikiText

            Bulleted Lists

            You can create bulleted (unordered) lists with * characters ():

            Numbered Lists

            Numbered (ordered) lists use # instead of * ():

            1. First item
            2. Second item
            3. Third item

            You can also mix ordered and unordered list items:

            Here's an example the other way around, with numbers as the first level:

            CSS Classes

            You can also assign a CSS class to an individual member of a list with this notation:

            Mixing Lists and Block Quotes

            Note that Block Quotes in WikiText can be mixed with lists. For example:

            Paragraphs in Lists

            Entries in the list are delimited with a linebreak, making it impossible to include linebreaks within a list entry. There are a couple of workarounds.

            First, you can transclude paragraph content from another tiddler. For example:

            * First entry
            * <$transclude tiddler="MyTiddler" mode="block"/>
            * Third entry

            Secondly, you can use an HTML "div" element to contain the multiline content. For example:

            # Step 1
            # Step 2
            # Step 3<div>
            
            Here is the first of several paragraphs. Note that the double linebreak preceding this paragraph is significant.
            
            And here is the second of several paragraphs.
            </div>
            # Step 4
            # Step 5
            # Step 6

            Load a Local HTML File in an Iframe

            Mohammad11th April 2021 at 6:01pm
            solution

            How to load a local html file into TW using iframe?

            1. Assume غخع have a local html file called test.html located in examples/test.html
            2. Use the html5 ifram tag as below
            <iframe src="relative path to local html" width="xx" height="xx" />

            Example

            The below test.html located in examples folder

            <!DOCTYPE html> 
            <html lang="en"> 
            <head> 
                    <meta charset="utf-8"> 
                    <title>An HTML page</title> 
            </head> 
            <body> 
            <h1>An HTML page</h1> 
            <p>This is an HTML page.</p> 
            </body> 
            </html> 

            Now load it using iframe as below:

            Logical Opertaion with Filters

            Mohammad11th April 2021 at 6:01pm
            filter solution

            Filtering is very powerful and it can be used for logical operations. This is some notes about logic operations using filtering in tiddlywiki. Most of what is here isn't all that useful generally, but hopefully it can be used to simplify filtering problems in tiddlywiki.

            Filter operators that this applies to the operators days, field, has, haschanged, is, regexp, sameday, search, prefix, suffix, tag and untagged

            Lowercase and Space Handling in Fields Name

            Mohammad11th April 2021 at 6:01pm
            solution
            An issue in field name created by action-setfield
            While Tiddlywiki does not allow to add fileds with space in name or uppercase word, but it seems the through the $action-setfield it is possible. How to handle space and upercase words in field name created by $action-setfield?

            Solution

            This does seem like a "hole" in the core handling in Tiddlywiki 5.1.21 and older. Also, when you save and reload the file, the upper case letters are automatically re-mapped to lowercase, but the spaces result in TWO fields (e.g., "this field" becomes two fields, "this" and "field").

            Here is a "fixup" for it:

            <$vars fieldName={{{ [<fieldName>split[ ]join[_]lowercase[]] }}}>

            What this does is replace spaces with underscore, and change all uppercase to lowercase

            Example

            <$edit-text tiddler="$:/temp/newfieldname" tag=input />
            <$edit-text tiddler="$:/temp/newfieldvalue" tag=input />
            <br>
            <$button> make field
               <$vars fieldName={{{ [{$:/temp/newfieldname}split[ ]join[_]lowercase[]] }}}>
               <$action-setfield $field=<<fieldName>> $value={{$:/temp/newfieldvalue}}/>
               </$vars>
            </$button>

            Macro Calls in WikiText

            22nd April 2021 at 6:56am
            WikiText

            To call a macro, place <<double angle brackets>> around the name and any parameter values.

            By default, parameters are listed in the same order as in the macro's definition. A parameter can be labelled with its name, either for clarity or to modify the order.

            If no value is specified for a parameter, the default value given for that parameter in the macro's definition is used instead. (If no default value was defined, the parameter is simply blank.)

            Each parameter value can be enclosed in 'single quotes', "double quotes", """triple double quotes""" or [[double square brackets]]. Triple double quotes allow a value to contain almost anything. If a value contains no spaces or single or double quotes, it requires no delimiters.

            A more formal presentation of this syntax is also available.

            The syntax is actually a shorthand for a widget. The widget itself offers greater flexibility, including the ability to transclude parameter values or generate them via additional macros.

            As macros are simply parameterised variables, a variable's value can be inserted using the same techniques.

            Examples

            Named vs.unnamed parameters

            In the wikitext notation, using named parameters is always the safer choice compared to defining values only. Not naming parameters may have confusing side effects. For example, imagine the first parameter of some macro specifies a state tiddler while the second one is intended for a template tiddler. Should you accidentally forget to define the first parameter or are confused about the order, the next time your macro is run, which might even be triggered using the preview, your template tiddler may inadvertently be overriden with what was intended to be the state.

            Macro Definitions in WikiText

            22nd April 2021 at 6:56am
            WikiText

            A macro is defined using a \define pragma. Like any pragma, this can only appear at the start of a tiddler.

            The first line of the definition specifies the macro name and any parameters. Each parameter has a name and, optionally, a default value that is used if no value is supplied on a particular call to the macro. The lines that follow contain the text of the macro text (i.e. the snippet represented by the macro name), until \end appears on a line by itself:

            Alternatively, the entire definition can be presented on a single line without an \end marker:

            \define sayhi(name:"Bugs Bunny") Hi, I'm $name$.

            A more formal presentation of this syntax is also available.

            Accessing variables and parameters

            Inside the macro there are several methods for accessing variables defined outside of the macro or parameters from the macro parameter list.

            syntaxdescription
            $...$Text substitution of a parameter defined in the macro parameters list
            <<__...__>>Parameter-as-variable access to a parameter defined in the macro parameters list
            $(...)$Text substitution of a variable defined outside of the macro
            <<...>>Access to a variable (or other macro) defined outside of the macro

            Placeholders $(...)$

            The macro can contain placeholders for parameters. These consist of a parameter name between dollar signs, like $this$.

            The macro can also contain placeholders for variables. These consist of a variable name (or macro name) between dollar signs and round brackets, like $(this)$.

            The actual value of the parameter or variable is substituted for the placeholder whenever the macro is called:

            Parameters as Variables <<__...__>>

            Parameters in a wikitext macro can be accessed as variables by using the syntax <<__...__>>, i.e the parameter name surrounded by double underscores. For example, the example above could also be expressed as:

            \define sayhi(name:"Bugs Bunny") Hi, I'm <$text text=<<__name__>>/>.

            Accessing parameters as variables only works in macros that are wikified and not, for example, when a macro is used as an attribute value. The advantage of the technique is that it avoids the parameter value being substituted into the macro as a literal string, which in turn can help avoid issues with parameters that contain quotes.

            For example, consider this macro. It invokes another macro using the single parameter as an argument for it:

            \define film-quote(line) <$macrocall $name="anothermacro" actor="Bugs Bunny" line="""$line$"""/>

            The code above will fail if the macro is invoked with the argument containing triple double quotes (for example <<film-quote 'I quote thrice """ - see!?'>>). Using parameter variables offers a workaround:

            \define film-quote(line) <$macrocall $name="anothermacro" actor="Bugs Bunny" line=<<__line__>>/>

            Scope

            Macros are available to the tiddler that defines them, plus any tiddlers that it transcludes.

            To make a macro available to all tiddlers, define it in a tiddler that has the tag .

            It is also possible to write a macro as a JavaScript module. ~JavaScript macros are available to all tiddlers, and offer the maximum flexibility.

            A tiddler can manually import macro definitions from a selection of other tiddlers by using the widget.

            macro for comparison

            Mohammad11th April 2021 at 6:01pm
            solution task
            \define xx(a:"Empty",b:"Empty")
            <$reveal type="nomatch" text={{{[<__a__>] -[<__b__>]}}} default="">
            
            Ther are different. 
            
            * a: $a$ 
            * b:$b$
            </$reveal>
            <$reveal type="match" text={{{[<__a__>] -[<__b__>]}}} default="">
            
            They are the same.
            
            * a: $a$ 
            * b:$b$
            </$reveal>
            \end

            Macro in Tiddlywiki: A Programming Issue

            Mohammad11th April 2021 at 6:01pm
            solution

            Macro in Tiddlywiki

            TiddlyWiki macro definitions are NOT functions in the traditional programming sense. Although input "parameters" can be passed to them, and they "return" something as a result, they don't actually "run" any of the "code" they contain. When a macro is invoked, it does two things (and ONLY two things):

            1. replace all occurrences of $paramname$ with the corresponding value that was passed as an input parameter
            2. replace all occurrences of $(variablename)$ with the current value of the variable (assuming it is defined in the context of the "caller" of the macro)

            That is ALL it does. After doing the replacements, the resulting content is "returned". If the macro call is being used as a widget parameter, then the result is simply passed along to the widget for further processing. However, if the macro call is embedded directly in wiki content, then it is rendered.

            An Issue

            Consider the below code in a tiddler:

            Fields
            title : Headache
            list : [[A B]] [[C D]] E
            tidd : Headache
            
            \define get-related-tiddlers() <$view tiddler=$(tid)$ field="list" mode="block"/>
            
            \define test(list-tids) 
            list-tids= $list-tids$
            <$list filter="[enlist<__list-tids__>]">
            
            </$list>
            \end
            
            <$set name=tid value={{!!tidd}}>
            
            tid= <<tid>>
            
            get-related-tiddlers= <<get-related-tiddlers>>
            
            1. WORKS: <$macrocall $name="test" list-tids={{!!list}} field="list" />
            
            2. BREAKS: <$macrocall $name="test" list-tids=<<get-related-tiddlers>> field="list" />
            
            <$wikify name="GOT-related-tiddlers" text=<<get-related-tiddlers>>>
            
            3. WORKS!: <$macrocall $name="test" list-tids=<<GOT-related-tiddlers>> field="list" />
            
            </$wikify>
            </$set>
            Question
            Why example 2 in the above code breaks?

            In light of the above, when you invoke the following:

            2. BREAKS: <$macrocall $name="test" list-tids=<<get-related-tiddlers>> field="list" />

            the value of the "list-tids" parameter is simply passed along to the widget and will NOT be the contents of the list field, but rather will literally be:

            <$view tiddler=SomeTiddlerName field="list" mode="block"/>

            In contrast, when you use <$wikify> on the macro, you are forcing it to be rendered and then capturing that result in the variable "GOT-related-tiddlers". Thus, the <$view> widget contained in the macro DOES get processed, and the result is then available to pass along to the "list-tids" param.

            Also, I wonder if this use case was the primary reason for making the $wikify widget? If not, what was?
            I would say it was a convincing reason, though perhaps not the only one.

            Macro Overloading

            Mohammad11th April 2021 at 6:01pm
            exmp043 solution
            Wikipedia

            In some programming languages, function overloading or method overloading is the ability to create multiple functions of the same name with different implementations. Calls to an overloaded function will run a specific implementation of that function appropriate to the context of the call, allowing one function call to perform different tasks depending on context.

            What is macro overloading in TiddlyWiki?
            If a macro is called in a scope one (e.g inside a tiddler) and the macro itself calls another macro (a second macro) internally say maymac, then if this second macro maymac is existed in the scope of calling tiddler, it will override the core or other scope macro! This is macro overloading.

            A good example is the toc-caption macro. For more information see Jeremy Ruston explanation here.

            Example

            A set of macros has been defined in exmp043/macro/overloading as follows:

            If the macro mac-xx is called the expected output is as below:

            Now, consider it is called from Example 43: Macro Overloading which itself has an internal macro with the same name mac-xx as defined in exmp043/macro/overloading.

            Strangely the out is as bellow:

            What happened is, in the second case there is a mac-xx defined inside Example 43: Macro Overloading, so TW overloads the original macro with this one.

            Macro with Dismiss Alerts Inline

            Mohammad11th April 2021 at 6:01pm
            exmp092 solution
            How to use a macro to show an inline alert message with close button to dismiss the message and when wiki is reloaded the message shown again?
            One solution is to use a stateTiddler which its value set on the wiki startup

            Solution

            The below macro uses $:/temp/mywarning tiddler as a state tiddler. If it is missing then the alert message will be shown. If the dismiss button is pressed, the tiddler is created and message will be disappeared.

            On wiki reload! To show again the message, the tiddler exmp092/startup-action with below contents is used to delete the $:/temp/mywarning tiddler.

            Example

            Click the dismiss button. To see the message again reload the wiki.

            Macro with Variable Number of Arguments

            Mohammad11th April 2021 at 6:01pm
            exmp013 solution

            How TW macro can process variable number of arguments? Assume you have a macro like <<mymac arg1>> and you can call it like <<mymac arg1 arg2 arg3>>

            Solution

            To have variable number of arguments you can use list as below:

            \define stuff(myvar mylist) 
            I saw $myvar$. Then <br/>
            <$list filter="[enlist[$mylist$]]">
            <$view field="title"/><br/>
            </$list>
            \end

            The mylist argumrnt here can accept a list of argumrnts and the inside list can recognize them!

            See Example 13

            Macros in WikiText

            22nd April 2021 at 6:56am
            WikiText

            The use of macros in WikiText has two distinct aspects:

            Make Version Incremented Backup on Windows

            Mohammad11th April 2021 at 6:01pm
            solution

            The below code uses robocopy to create a version-incremented copies of files (here tiddlers)

            The script:

            • always create an identical copy of source tiddlers
            • create version-incremented copies of all files differ from their source (you may change a tiddler in source or backup folder)
            • version number started from 000 ~ 999, so this is maximum number of versions
            • use robocopy which is very fast method for creating backups

            How to use

            • change the source and destination folders to meet your case
            • run the batch file
            :: Ref: https://www.experts-exchange.com/questions/23427327/How-to-use-Robocopy-to-create-files-Versions.html
            :: Running the script will first Robocopy any files which don't already exist in the destination,
            :: then use xcopy to create version-incremented copies of any files which do exist in the destination.
            :: Mohammad Rahmani
            :: Github: https://github.com/kookma
            
            :: Rev 0.9
            :: Apr 8th, 2019
            
            
            @echo off
            cls
            
             
            :: Source and destination paths.  Do not include a trailing backslash
            set SourceFolder="G:\Test-Robocopy\my source"
            set DestinationFolder="G:\Test-Robocopy\my dest"
              
             :: ------------------------------------------------------------------------------------------------
             
             :: Remove double and single qoutes if any
             set source=%SourceFolder:"=%
             set source=%source:'=%
             set dest=%DestinationFolder:"=%
             set dest=%dest:'=%
             
             setlocal EnableDelayedExpansion
             :: Copy any file, folder not existed in the destination
            robocopy "%source%" "%dest%" /XC /XN /XO /R:3 /W:3 /E /XX 
             
            :: List all files existed in destination, but there is a difference between each file and its 
            :: source
            for /F "tokens=*" %%G in ('robocopy "%source%" "%dest%" /XX /L /NDL /NS /NC /NJH /NJS /E') do (
             call :_process "%%G"
            )
            goto :eof
             
            :: The process subroutine here does the below tasks
            :: a. create a new copy of destination file prefixed with _vxxx, where xxx: 001 ~ 999 (version-incremented copies )
            :: so this only keep 1000 revisions and cannot work for more revisions
            :: b. copy the source file and overwrite the destination. So, destination is always equal to source
            :_process
            set counter=0
            set version=000
            set source_path=%~dp1
            set file=%~n1
            set ext=%~x1
             
            :: Create the destionation path for the existed file. by replacing the
            :: source path with destination path. (search and replace)
            set dest_path=!source_path:%source%=%dest%!
            
            
            :: Check to see what is the last version number to create the next version number 
            :_loop
            if exist "%dest_path%%file%_v%version%%ext%" (
             set /A counter+=1
             :: create a number with leading zeros like 001 ~ 999
             set version=000!counter!
             set version=!version:~-3!
             goto :_loop
            )
            
            :: Increment the version number of the file in destination  which differes from its identical one in source
            echo F|xcopy "%dest_path%%file%%ext%" "%dest_path%%file%_v%version%%ext%" /C /H /R /Z  /Q
            :: Copy from source and overwrite the respective file in destination:  source = destination
            echo F|xcopy %1 "%dest_path%\%file%%ext%" /C /H /R /Z /Y /Q
            goto :eof
            
            endlocal
            

            Manually Add More Language Brushes to Highlight.js

            Mohammad11th April 2021 at 6:01pm
            solution
            1. Open https://highlightjs.org/download/
            2. Select the language you want and then click download
            3. Unzip the highlight.zip and open the highlight.pack.js in a text editor
            4. Paste the following line as the first line in the text editor

              var hljs = require("$:/plugins/tiddlywiki/highlight/highlight.js");
            5. Paste the following line as the last line in the text editor

              exports.hljs = hljs;
            6. Open the $:/plugins/tiddlywiki/highlight/highlight.js tiddler in your wiki and click on edit button from text editor
            7. Replace the content of this tiddler with the content of edited highlight.pack.js from text editor
            8. Save tiddler and save wiki
            9. Reload the wiki

            That's all

            Remarks

            Manually installing a plugin

            21st April 2021 at 6:44pm
            FromTiddlerWiki
            1. Create a backup of your current TiddlyWiki HTML file (just in case)
            2. Open your TiddlyWiki in a browser
            3. In another browser window, find a link to the plugin, e.g. $:/plugins/tiddlywiki/example. You will typically find these links on the home page of the plugin (for example, https://tiddlywiki.com/plugins/tiddlywiki/katex/)
            4. Drag the link $:/plugins/tiddlywiki/example to the browser window containing your TiddlyWiki
            5. Save your TiddlyWiki ()
            6. If a yellow warning bar appears at the top of the window, refresh the window so that TiddlyWiki completes installation of the plugin
              • It is no longer necessary to refresh TiddlyWiki when deleting plugins that support dynamic loading. See PluginMechanism for more details
            7. The plugin should now be available for use

            MarkDown

            11th April 2021 at 6:01pm
            MarkDown

            markdown是一种类似htm标记语言的轻量级标记语言,用简单的几个键盘符号作为渲染的标记,剩下的内容是纯粹的纯文本格式,这就是所有你要做的工作。简单举个例子:一个#号跟一个空格表示为1号标题,两个##跟一个空格表示2号标题,一次类推;一个* 号跟一个空格表示无序的列表;一个> 跟一个空格表示垂直的和文字等高的竖线,两个就表示缩进的和文字等高的竖线;一对三个波浪线就可以生成一个简洁大方的代码框; 具体用法参考语法详解。最方便的是这些简单的符号加文本的格式可以被浏览器解释为正确的渲染效果,正因为简单实用和高效,所以在网络上轻松普及。入门级的的MarkDown编辑器推荐typora,熟悉了标准的语法和typora的使用,可以选择你自己喜欢的其他风格的MarkDown编辑器,可以很快上手。

            Mat Star Hub +

            Mohammad11th April 2021 at 6:01pm
            solution task

            Match

            11th April 2021 at 6:01pm
            Excel

            Match All List Items and Display Their Content

            Mohammad11th April 2021 at 6:01pm
            exmp091 regexp-tutorial solution
            What regexp filter can be used to match all list items <li styel></li> find and display their content each in a separate line?
            This cannot be done using simple regexp, or splitregexp filter operators and needs to process using a set of filters as described below

            Solution

            The below code finds all list items and show their contents in exmp091/data01. Note that

            • A list item is the one delimited between <li> and </li>
            • The list item can have class like <li class="some class"> or style or both.
            • What is between the opening and closing tag is called the content of list item which should be displayed here

            Remarks

            • The {exmp091/data01} transclude the raw text in tiddler exmp091/data01
            • The splitregexp[\n] split the text based of end of line character. That means it split text into lines.
            • The join[ ]
            • The splitregexp[<li.*?>]butfirst[1] split text on <li.*?> means on any <li> or <li class="some class"> or style or both. and then throw away the first part.
            • The splitregexp[</li>]butlast[1] means split on closing tag </li> and throw away the last part
            • The regexp<realchars> remove empty lines.

            Math Macro a Simple Calculator

            Mohammad11th April 2021 at 6:01pm
            solution
            Basic ragscalculator
            Using basic mathematical operations in Tiddlywiki 5.1.20+ it is possible to develop a simple calculator for basic operations like addition, subtraction, multiplication

            The macro

            The ragscalculator below accept two numbers and the operator and simply return the result

            Content and atributes
            a: first number of your math equation
            b: second number of your math equation
            op: basic mathematical operator as below
            for + : use "add"
            for - : use "subtract"
            for * : use "multiply"
            for / : use "divide"

            Examples

            The below examples show how ragscalculator can be used.

            Maximum Width of TOC

            Mohammad11th April 2021 at 6:01pm
            solution tocxx

            On the https://tiddlywiki.com/ website, if you make a tabbed internal Table of Contents as follows:

            Tiddler Title: MyTest
            <$macrocall
                $name="toc-tabbed-internal-nav"
                tag="Learning"
                selectedTiddler="$:/temp/toc/selectedTiddler"
                unselectedText="<p>Select a topic in the table of contents. Click the arrow to expand a topic.</p>"
                missingText="<p>Missing tiddler.</p>"
            />

            Some long titles cause the left side to take up half the width of the tiddler, leaving too little space to display tiddler contents on the right side.

            I want to change (reduce) the width allowed on the left-side index of links without modifying the core tiddlers. How to do this?

            Solution

            Tag your tiddler above "Test". Create a stylesheet tiddler (a tiddler tagged $:/tags/Stylesheet) and put the below content inside it.

            [data-tags~="Test"] .tc-tabbed-table-of-contents .tc-table-of-contents {
            max-width: 30% ;
            }

            That should change the max-width. I think you can see how to change "Test" to some other tag name, if you prefer.

            MBR

            11th April 2021 at 6:01pm
            BIOS&MBR

            Message of the Day Generator

            Mohammad11th April 2021 at 6:01pm
            exmp094 solution
            How to create a message of the day generator? In other words how to show a message based on the day of month?
            Different solution is possible, but one is to use a data tiddler to store message and use the now macro to find the day number and extract a message with that number from data tiddler

            Solution

            The below macro message-of-day gets a data tiddler containing the message and shows the message of the day.

            Remarks

            The message-of-day macro contains

            • an input parameter dataTiddler which passes the title of data tiddler which stores messages. Each message is stored as an index/value pair where the index is 1, 2, 3, ...31 and the value is a message in wikitext format
            • a $set widget to store the day number of month at current data using <<now DD>>. See Date Format
            • a $list widget to find the index and match day number of today
              • the filter extracts all indexes from dataTiddler (<__dataTiddler__>indexes[])
              • and matches against number of day (match<dd>)
            • a $transclude widget to retrieve the message (the value) from dataTiddler

            Example

            The below example uses the exmp094/data as a dataTiddler in which all 31 quotes have been stored. Indexes start from 1 to 31 and every index has a value in which the quote is stored. The author name is given in italic.

            More on Conditional Output

            Mohammad11th April 2021 at 6:01pm
            conditional solution

            When transclude or view widgets are used for conditional output, an issue raised with empty caption field.

            Consider below solution Eric Shulman

            <$view field="caption">
               <$view field="title"></$view>
            </$view>

            or this one by THomas Elmiger:

            <$link tooltip={{!!title}}><$transclude field="caption"><$view field="title"/></$transclude>&nbsp;</$link>
            S.S.

            The problem with the above code is that if there is a caption field, but it is empty, nothing will show. I find that unacceptable. This was the exact issue I tried to have fixed (on github) but that hasn't been resolved because of possible performance issues in a large table of contents.

            The better solution proposed by S.S. as below

            Best solution
            <$list filter="[all[current]has[caption]]"
                  emptyMessage="""<$view field="title"/>""">
                  <$transclude field="caption"/>
            </$list>
            See also Jeremy note on GitHub

            Remarks

            TonyM proposed a solution if you want to make a link to a tiddler when there is a caption and it has higher priority

            <$list filter="[all[current]has[caption]get[caption]] ~[{!!title}]" variable=name>
            <$link to=<<name>> tooltip="Custom tooltip"><<name>></$link>
            </$list>

            You can also make a macro for this as below

            \define caption-title()
            <$list filter="[all[current]has[caption]get[caption]] ~[{!!title}]" variable=name>
            <$link to=<<name>> tooltip="Custom tooltip"><<name>></$link>
            </$list>
            \end
            
            and use <<caption-title>> no paramters to always show first the caption, then the titlewith an active link.

            Multiple Sort Rules in TOC

            Mohammad11th April 2021 at 6:01pm
            solution
            How to create a table of contents and sort sub branches?

            If you make a table of contents from all tiddlers tagged with TableOfContents then

            <<toc-selective-expandable  "TableOfContents">>

            The sorting is fine for most cases, but you would like all your items tagged Journal to be sorted by the created field. How can you apply a separate sort order to just those sub-items tagged Journal?

            The trick is to add a field to the parent tagging tiddler (i.e. Journal) that points to a different sort criteria. Let's call the field fuzzy, and populate it with the value created (created is the name of the field that contains a tiddler's creation date).

            Now change your Table of Contents to look like this:

            <<toc-selective-expandable  "TableOfContents" "sort{!!fuzzy}" >>

            Other readings

            Multiple Wiki and Browser Tab Management

            Mohammad11th April 2021 at 6:01pm
            solution
            • The following linkintab macro will always open in the same browser tab, even if it is already open.
            • If your links to wikis use the target parameter you can ensure you do not open the wiki more than once.
            • You are also protected if you try and reopen the tab and you have not saved previous work.
            • In FireFox, if you move a tab to its own window, and click the link again it will open that windows again (and reload) - if it was minimised it will restore it.

            Why do this?

            • It allows you to keep tabs closed and open them as needed without fear of saving over the same wiki (Even without using bob)
            • You can establish a Directory Wiki to other wikis that honours this reusable tabs method.
            • No need to go looking for existing tabs, windows or minimised browser windows, just return to your directory, reopen if not open, reload in same tab if open (and saved)

            Macro

            Put the below script inside a tiddler and tag it with $:/tags/Macro

            \define linkintab(link tabname)
            <$set name=url value="$link$">
            <$set name=tabname value=$tabname$>
             <a href=<<url>> target=<<tabname>> ><<tabname>></a> 
             </$set></$set>
            \end

            Example

            <<linkintab "https://www.w3schools.com" W3Schools>>
            <<linkintab "http://127.0.0.1:8084/"Bob>>

            Remarks

            In the follwing case, it is using data from a dataTiddler (the current Tiddler in a list)

            <a href={{##wiki-url-full}}  target={{##wiki-sitetitle}}>{{$:/core/images/link}}</a>

            And as the above macro shows the following also works

            <a href=<<url>> target=<<tabname>> ><<tabname>></a>

            MyContents

            21st April 2021 at 9:54pm
            $:/tags/SideBar

            MyOwn

            11th April 2021 at 6:01pm
            LearningTiddlyWiki

            MySql

            11th April 2021 at 6:01pm
            DataBase

            Navigate to a Tiddler with Space in Title

            Mohammad11th April 2021 at 6:01pm
            solution

            \define target() My Little Tiddler
            
            <$button>Go forth
            <$action-navigate $to=<<target>> />
            </$button>
            

            NEED disucssion

            Mohammad11th April 2021 at 6:01pm
            solution
            Create a tiddler with unique title and open it in edit mode?
            use tm-new-tiddler, also the below method
            \define newTiddler(title, fields)
            <$set name="tempTid" value=<<qualify "temp/$(currentTiddler)$">> >
            <$action-createtiddler 
            $basetitle=<<__title__>> 
            $savetitle=<<tempTid>>
            $fields$/>
            <$action-sendmessage $message="tm-edit-tiddler" $param={{{[<tempTid>get[text]]}}} />
            </$set>
            \end
            
            <$button>Test
            <<newTiddler test>>
            </$button>

            Neocities Saver Plugin

            Mohammad11th April 2021 at 6:01pm
            solution
            How to host Tiddlywiki on free web hosting service neocities.org?
            Use the Neocities Save Plugin

            Instruction

            1. Go to https://neocities.org and create an accoung
            2. Go to setting and create an API key
            3. Download an empty.html from https://tiddlywiki-neocities-saver.neocities.org/
            4. Goto $:/ControlPanel, Saving Tab, Neocities Save and enter your API key
            5. Press the Save button

            If you have your own wiki simply drag and drop Neocities Saver plugin into your wiki!

            Nested Referencing Fields

            Mohammad11th April 2021 at 6:01pm
            solution
            • Question

            Assume you have a tiddler titled "Tiddler-A". It has a caption filed cotains: "I am Tiddler A". Next assume you have Tiddler-B, its summary filed contains "Tiddler-A" I want a transclusion like this in Tiddler-B

            {{!!summary!!caption}}

            But it doesnot work!

            • Solution

            The solution is given by Marks as below

            \define deref(tid fld) <$transclude tiddler=<<__tid__>> field=<<__fld__>> />
            
            <$macrocall $name="deref" tid={{!!summary}} fld="caption"/>

            nesting the effect of brackets

            Mohammad11th April 2021 at 6:01pm
            solution

            New Tiddler

            20th April 2021 at 10:27pm

            eeeee

            New Tiddler 1

            25th April 2021 at 9:58am
            $:/tags/MenuBar

            New Tiddler 5

            Mohammad17th April 2021 at 10:31pm
            done solution task

            Nightly Build

            Mohammad11th April 2021 at 6:01pm
            solution

            When working with https://tiddlywiki.com/prerelease/ it is good to know when and from which branch it has been built. To know this open $:/build tiddler and it will show the required information including:

            1. Branch
            2. Commit number
            3. Date and time of build

            Notes on Macro

            Mohammad11th April 2021 at 6:01pm
            solution

            Troubleshooting

            1. The Tiddlywiki core macro parser expects the parenthesis of the macro parameter list to immediately follow the macro name, without any intervening white space. Having space between macro "name" and the open parentheses of the parameter list, prevents the parser from properly recognizing the macro definition.

            Notes on Using External Web Content v1

            Mohammad11th April 2021 at 6:01pm
            solution

            A. Viewing in an iframe in Wiki:

            Note on Google app's- when accessing a site using a javascript login (an URL ending in .jspa), a "javascript not enabled" error message– so apparently javascript has issues operating in iframes, at least with Firefox 64.

            1. Google Doc's will display and can be edited in an iframe
              • if you're not signed into Google which would grant edit permission.
              • PROBLEM, if signed into Google, the sheet displays but with a "~JavaScript isn't enabled in your browser, so this file can't be opened. Enable and reload." message which prevents not just editing but scrolling the page.
              • doc permissions influence these results, ie an "edit" in the URL. Not tested on Google app assets made public.
            2. Google Sheets will display in an iframe
              • if you're not signed into Google which would grant edit permission.
              • PROBLEM, if signed into Google, the sheet displays but with a "JavaScript isn't enabled in your browser, so this file can't be opened. Enable and reload." message which prevents not just editing but scrolling the page.
              • doc permissions influence these results, ie an "edit" in the URL. Not tested on Google app assets made public.
            3. File hosting:
              • Google Drive - no
              • OneDrive - unknown, not tested
              • Dropbox - unknown, not tested
            4. Some websites:
              • Will have to test the website if it will view in an iframe.
                • If the site/page has HTTP response header X-Frame-Option "DENY" or "SAMEORIGIN", displaying in an iframe will not work unless the Wiki is in the same domain.
                • sites using a javascript login (an URL ending in ".jspa"), a "javascript not enabled" error message will appear instead of the website displaying– so apparently javascript has issues operating in iframes
                • When iframe viewing is prevented see Part B below.
            5. Youtube videos
              • "www.youtube.com/watch?_video ID_" won't view in iframe, but "www.youtube.com/embed/_video ID_" will.
                • Right click on a video at Youtbe and one of the options given is an embed snippet which is an iframe with the video url
                  • often gives a "video unavailable" error message.
            6. direct viewing of web hosted multimedia content:
              • Images, audio, video files online can be the src of an iframe
              • or images, audio, video files online can be embedded into tiddlers
                • this is useful with archive org audio which brings up a web page hosting the audio file
                • (1) using TW's _canonical_uri: for the file url and setting the tiddler type field ("audio/mp3" for audio)
                • (2) or using HTML audio and video tags in a tiddler
                • image hot-linking prevention on a website may block this
              • Text based files online can be the src of an iframe, any file that your browser can display in it without needing an external app, can be displayed in an iframe in its text format.

            • In these cases where content will not display within an iframe, the content will have to be opened in a new browser tab using Wikitext external link markup, due to iframe security precautions preventing viewing in an iframe.

            B. View in new browser window:

            (using Wikitext external link markup or html "a href" tag with target="_blank")

            1. Google Doc's, Sheets, Drive & other Google app's
              • signed in or not- depends upon the share setting of the asset
            2. other file hosting - ~OneDrive, Dropbox
            3. many websites
              • sites/pages using HTTP response header X-Frame-Option "DENY" or "SAMEORIGIN", displaying it in a new tab is the only way to view it.
              • sites/pages using javascriot log-in/front end (ie URL's ending in ".jspa", displaying it in a new tab is the only way to view it.
            4. Dropbox, others?
            5. Youtube videos can be opened in a new tab with Wikitext external link markup using the standard "www.youtube.com/watch?_video ID_" in its url.
            6. Of course images, audio, video, text files online can be viewed using Wikitext external link markup.
              • Interesting experiment- Facebook won't display within an iframe but setting the iframe src to an image on the Facebook page, the image will display within an iframe.
            • NOTE: if using html <a href> instead of using Wikitext external link markup, be sure to use target="_blank" to keep the url you're trying to open not open in the same tab your Wiki is in.

            Noteself

            21st April 2021 at 6:16am
            MyContents

            https://noteself.github.io/

            ~NoteSelf is the perfect place to store your ideas, notes, thoughts, tips, tricks, recipes... whatever you want to put into it! ~NoteSelf will store, index, and make it easily searchable, so you will find it instantly whenever you need it!

            You already know and love Evernote, we know it. It is comfortable, it syncs, has search capabilities... Wow, it's almost perfect, but what about:

            • Privacy - Everything is stored on the Evernote's servers!
            • Customization - If you don't like the interface of Evernote, there's nothing you can do

            ~NoteSelf is built on top of ~TiddlyWiki, a powerful, free, highly customizable and open-source personal wiki. We took the best of it, it's powerful customization system, and mixed it with one of the best embedded databases available, PouchDb, for bringing the synchronization capabilities you need.

            Notification Duration

            Mohammad11th April 2021 at 6:01pm
            solution

            Notifications are small informational messages that appear at the top right of the TiddlyWiki window, and automatically disappear after a preset time. How is it possible the preset time to about 15 s.

            Solution

            There is an internal JavaScript setting for the notification duration. It can be changed with this one liner:

            title: $:/_ChangeNotificationDuration
            module-type: startup
            type: application/javascript
            
            $tw.config.preferences.notificationDuration = 15 * 1000;

            This is a the code $:/_ChangeNotificationDuration

            Office

            22nd April 2021 at 8:06pm
            MyContents

            Online Dictionary Lookup

            Mohammad11th April 2021 at 6:01pm
            exmp028 solution

            The below solution shows how an Online Dictionary Lookup can be created from inside Tiddlywiki.

            Create dictionary tiddler

            In a tiddler titled: S.S./data/dictionaryLinks and with its Content Type set to : application/x-tiddler-dictionary put links of queries to those online dictionaries (websites) you wish to use. I have the following

            Create macros

            In a tiddler tagged with $:/tags/Macro , define the dictionary macro as follows:

            Here the first macro dataLinkCreator create the query to an online dictionary and the second macro dictionary gets the word to lookup and create a list of links to all dictionaries existed in S.S./data/dictionaryLinks

            Usage

            It possible to directly call the dictionary macro as below

            <<dictionary word>>

            A case study

            Assume some words are stored as tiddler title. It is required to show the links to online dictionaries for title word. Here two solution are given.

            1. A template can be used to show the links, and the template contains the line:

              <<dictionary {{!!title}}>>

              The tiddler's title is simply the word itself, for example: avarice

            2. In another case, tiddler title is like Word: name, then the template line could be replaced with:

              <$macrocall $name="dictionary" word={{{ [<currentTiddler>removeprefix[Word: ]] }}} />

              See: Word: avarice

            Open a Tiddler without Navigating to It

            Mohammad11th April 2021 at 6:01pm
            solution

            I have a lots of tiddlers I want to open in the story. Once I have done this I will do something on each tiddler. But until then I do not want to have to scroll back to my list.

            how to provide a link to a tiddler in a list that will open but not navigate to it?
            Use $action-navigate with $scroll=no
            <$button>
            <$action-navigate $to=SomeTiddler $scroll=no/>
            DO EET!!
            </$button>

            making a macro to style it like a link and use the tiddler text as the button text could make it less obtrusive.

            Open All Tiddlers Meet Some Criteria

            Mohammad11th April 2021 at 6:01pm
            solution
            How to open all tiddlers meet special criteria?
            Use the action-navigate widget

            Example

            The below macro

            • Gets a filter as a criteria to find all tiddlers meet that criteria.
            • Uses the tm-close-all-tiddlers message to close all tiddlers open in story river
            • Uses the action-navigate to open every output of filtered list in story river
            \define open-all(filter, label:"Open all")
            <$button>$label$
            <$action-sendmessage $message="tm-close-all-tiddlers"/>
            <$list filter=<<__filter__>> >
            <$action-navigate $to=<<currentTiddler>> />
            </$list>
            </$button>
            \end

            Demo

            1. Open all tiddlers tagged with myTag.

              <<open-all filter:"[tag[myTag]]" label:"Open tagged with myTag">>
            2. Open all tiddlers have the word semantic in their title in alphabetical order.

              <<open-all filter:"[search:title[semantic]] +[sort[]]" label:"Open tagged with myTag">>

            Related solutions

            These solutions are similar:

            Open all Tiddlers with Tag-X

            Mohammad11th April 2021 at 6:01pm
            exmp033 solution
            How is it possible to open all tiddlers tagged say with mytag in story river?
            This is simply can be done using a button widget. See the below examples

            Example

            The below example contains a macro to create a button, accept a button caption, and a tag. On button click all currently open tiddlers in story river are closed and all tiddlers tagged say with mytag will be opened.

            The example is implemented using Example 33: Open all Tiddlers Tagged with batch tiddler

            Remarks

            1. Macro myproject has three parameter attributes
              • mytag: the tag name tiddlers tagged with
              • msort: the type of sort, e.g.
                • title to sort with tiddler title
                • created to sort with tiddler created date
                • modified to sort with tiddler modified date. This is the default value.
                • etc
              • title: this is the button caption
            2. The button widget has two actions
              • Close all currently open tiddlers in the story river using tm-close-all-tiddlers message
              • Open all tiddlers tagged with mytag using a list widget and action-navigate widget.

            Go to Example 33 to see the macro in action.

            Related solutions

            These solutions are similar:

            Order of Stylesheets in Tiddlywiki

            Mohammad11th April 2021 at 6:01pm
            solution

            The list and order of stylesheet used in Tiddlywiki can be found here

            Control Panel > Info > Advanced > Stylesheets

            This tiddler shows the order of StyleSheets, and using the tag pill therein you can drag and drop to reorder them.

            CSS by definition is Cascading if you can't see what the cascade order is, you can easily be tricked

            Unless we were to provide details of all the class names already applied to all TiddlyWikis elements we should also provide information that allows people to identify those elements such as via inspect. And suggest how these can be overridden.

            More info

            Paragraphs in WikiText

            22nd April 2021 at 6:56am
            WikiText

            To mark the end of a paragraph in TiddlyWiki you need to type enter twice to create a double line break:

            This is the first paragraph.
            
            And this is the second paragraph.

            Single line breaks are ignored within paragraphs. For example:

            For situations where this behaviour isn't convenient, you can also use Hard Linebreaks in WikiText.

            passing multiple strings

            Mohammad17th April 2021 at 10:31pm
            done solution task

            PDF Document Link

            Mohammad11th April 2021 at 6:01pm
            solution

            The below small macro creates a document link. It gets a thord attributes as parameters whihc here can be used to refer to a certain page in a PDF.

            \define doc-link(path name parameters)
            $path$$name$$parameters$
            \end

            Example

            Performance Instrumentation

            Mohammad11th April 2021 at 6:01pm
            solution
            Run and time
            How it is possibe to measure the time for excution of any action in Tiddlywiki, like the time a macro takes to perform its operation task?

            The core has built-in performance instrumentation for the refresh cycle. See “Performance Instrumentation” on the “Settings” tab of control panel. The wiki will need to be reloaded before it takes effect.

            With performance instrumentation switched on, there is additional timing information displayed the browser developer console each time a refresh cycle is triggered. For example:

            performance: mainRender: 327.83ms 
            performance: +filter: 49.70ms 
            performance: styleRefresh: 9.14ms 
            performance: +filter: 2.46ms 
            performance: mainRefresh: 68.10ms 
            performance: +filter: 37.69ms 

            The information above should be interpreted as follows:

            "Initial rendering of the main page took 327ms (of which 50ms was filter evaluation). Refreshing the page stylesheet took 9ms (of which 2ms was filter evaluation). Refreshing the main page took 68ms (of which 38ms was filter evaluation)"

            • mainRender is the time taken for the initial display of the page template
            • styleRefresh is the time taken to refresh the page stylesheet
            • mainRender is the time taken to refresh the main page template
            • in each case, +filter denotes the time taken up with filter evaluation.

            As an example, try switching between the sidebar tabs to compare how long they take to render.

            See also:

            Performance on Mobile

            Mohammad11th April 2021 at 6:01pm
            solution task

            TW on mobile

            PHP

            21st April 2021 at 9:57pm
            Web

            Plugins and Node.JS version of Tiddlywiki

            Mohammad11th April 2021 at 6:01pm
            nodejs solution

            Add comment by Mario on installing server version of plugins!


            Assume a local wiki created in mywiki folder, how is it possible to add some plugins?
            there is three different methods to have plugins working in a local wiki (e.g mywiki)
            • use the plugins globally installed in Tiddlywiki/plugins root folder (available to all local wikis)
            • use the packged plugin in JSON tiddlers (globally or locally)
            • use the local plugin folders (only available to mywiki)

            Global installation (Client-Server configuration)

            If you have Tiddlywiki + Node.JS installed on your system, then every plugin installed in the root folder (tiddlywiki/plugins) then it will be available to all local wikis created on that machine

            Local installation

            By local installation it means plugin is only available to a specific wiki for that the plugin has been installed. Local installation can be done using a single file (ordinary JSON tiddlers)or plugin folder (separate tiddler files)

            • Single file (packaged plugin): open you locla wiki and drag and drop the plugin file into it (see manual installation)
            • Plugin folder (separate tiddler files): In your local wiki folder go to plugins folder. If not existed create one. Copy and paste your pluging folder there (see plugin folder)

            Populate Story List with Tiddlers

            Mohammad11th April 2021 at 6:01pm
            solution
            How to populate story list with a set of tiddlers?
            Set the list field of $:/StoryList with those tiddlers

            Example

            Close all tiddlers and populate story list with the below tiddlers

            • Home
            • Learning Resources
            • Check List Demo

            Position of an Item in a List with Respect to Selected Item

            Mohammad11th April 2021 at 6:01pm
            exmp085 solution
            How to check the position of an item in the list with respect to a selected item?

            Example

            Result

            Preserving open tiddlers at startup

            21st April 2021 at 6:49pm
            FromTiddlerWiki

            Ordinarily, at startup TiddlyWiki displays the tiddlers specified as a filter in the tiddler $:/DefaultTiddlers.

            Sometimes it's useful to re-open the same tiddlers that were open when the file was saved. To do so, set $:/DefaultTiddlers to this filter:

            [list[$:/StoryList]]

            This filter returns the tiddlers specified in the $:/StoryList tiddler, which is the system tiddler that TiddlyWiki uses to store the sequence of tiddlers in the current story.

            Prevent Empty Story River

            Mohammad11th April 2021 at 6:01pm
            solution

            TiddlyWiki has a configuration option.

            Create a new tiddler named: $:/config/EmptyStoryMessage with the following content.

            <div class="tc-tiddler-frame">{{HelloThere}}</div>

            So if users close the last tiddler in the story, the "HelloThere" tiddler will be shown. You can use any name here!!

            Private Macro

            Mohammad11th April 2021 at 6:01pm
            solution
            How to have local or private macro?
            Private macro is a macro is not accessible through the Tiddlywiki global namespace. These are normally auxiliary macros used by other macros or are specific to a plugin.

            Solution

            You can use the existing import pragma to bring in macro definitions from other tiddlers without cluttering the global name space. For example, you might have a global macro defined in a tiddler tagged $:/tags/Macro, and then put your local macros into tiddlers just tagged $:/tags/MyPublisher/MyPlugin/LocalMacros. Then, at the top of your global macro you’d bring in those local macros with:

            \import [all[shadows+tiddlers]tag[$:/tags/MyPublisher/MyPlugin/LocalMacros]!has[draft.of]]
            
            \define myPublicMacro()
            …

            Providing Variable to tm-notify Widget Message

            Mohammad11th April 2021 at 6:01pm
            exmp098 solution
            How to pass variable to tm-notify widget message?
            The variables can be provided to tm-notify as hasmap of variables 1.

            Solution

            The below macro my-action uses the tm-notify to display the content of tiddler passed to $param (here exmp098/notifyTemplate) as notification.

            Remarks

            The tm-notify in the above macro has the below attached parameters:

            the $param gets the exmp098/notifyTemplate tiddler to display as alert (notification)
            the variable01 which is provided to the notification as a variable.
            the variable02 which is provided to the notification as another variable.

            Example i

            The below example call my-actions using a $button widget with default parameters value.

            Example ii

            The below example call my-actions using a $button widget with provided parameters value.

            PyThon

            11th April 2021 at 6:01pm
            MyContents

            Python编辑-转

            13th April 2021 at 9:29pm

            基础

            编码

            # -*- coding: cp-1252 -*-

            标识符

            • 第一个字符必须是字母表中字母或下划线 _ 。
            • 标识符的其他的部分由字母、数字和下划线组成。
            • 标识符对大小写敏感。
            • 在 Python 3 中,可以用中文作为变量名,非 ASCII 标识符也是允许的了。

            python保留字

            >>> import keyword
            >>> keyword.kwlist
            ['False', 'None', 'True', 'and', 'as', 'assert', 'break', 'class', 'continue', 'def', 'del', 'elif', 'else', 'except', 'finally', 'for', 'from', 'global', 'if', 'import', 'in', 'is', 'lambda', 'nonlocal', 'not', 'or', 'pass', 'raise', 'return', 'try', 'while', 'with', 'yield']

            注释

            多行注释可以用多个 # 号,还有 '''"""

            多行语句

            Python 通常是一行写完一条语句,但如果语句很长,我们可以使用反斜杠(\)来实现多行语句,例如:

            total = item_one + \
                    item_two + \
                    item_three

            在 [], {}, 或 () 中的多行语句,不需要使用反斜杠(\),例如:

            total = ['item_one', 'item_two', 'item_three',
                    'item_four', 'item_five']

            数字(Number)类型

            • int (整数), 如 1, 只有一种整数类型 int,表示为长整型,没有 python2 中的 Long。
            • bool (布尔), 如 True。
            • float (浮点数), 如 1.23、3E-2
            • complex (复数), 如 1 + 2j、 1.1 + 2.2j

            字符串(String)

            • python中单引号和双引号使用完全相同。
            • 使用三引号'''"""可以指定一个多行字符串。
            • 转义符 '\'
            • 反斜杠可以用来转义,使用r可以让反斜杠不发生转义。 如 r"this is a line with \n" 则\n会显示,并不是换行。
            • 按字面意义级联字符串,如"this " "is " "string"会被自动转换为this is string。
            • 字符串可以用 + 运算符连接在一起,用 * 运算符重复。
            • Python 中的字符串有两种索引方式,从左往右以 0 开始,从右往左以 -1 开始。
            • Python中的字符串不能改变。
            • Python 没有单独的字符类型,一个字符就是长度为 1 的字符串。
            • 字符串的截取的语法格式如下:变量[头下标:尾下标:步长]

            语句

            Python可以在同一行中使用多条语句,语句之间使用分号(;)

            缩进相同的一组语句构成一个代码块,我们称之代码组。我们将首行及后面的代码组称为一个子句(clause)。

            输出

            print 默认输出是换行的,如果要实现不换行需要在变量末尾加上 end=""

            print( x, end=" " )

            导入

            • 将整个模块(somemodule)导入,格式为: import somemodule
            • 从某个模块中导入某个函数,格式为: from somemodule import somefunction
            • 从某个模块中导入多个函数,格式为: from somemodule import firstfunc, secondfunc, thirdfunc
            • 将某个模块中的全部函数导入,格式为: from somemodule import *

            基本数据

            Python 中的变量不需要声明。每个变量在使用前都必须赋值,变量赋值以后该变量才会被创建。

            在 Python 中,变量就是变量,它没有类型,我们所说的"类型"是变量所指的内存中对象的类型。

            Python允许你同时为多个变量赋值。例如:

            a = b = c = 1
            a, b, c = 1, 2, "runoob"

            标准的数据类型:

            1. Number(数字)
              1. int
              2. float
              3. bool
              4. complex(复数)。
            2. String(字符串)
            3. List(列表)
            4. Tuple(元组)
            5. Set(集合)
            6. Dictionary(字典)
            • 不可变数据(3 个):Number(数字)、String(字符串)、Tuple(元组);
            • 可变数据(3 个):List(列表)、Dictionary(字典)、Set(集合)。

            在Python 3里,只有一种整数类型 int,表示为长整型,没有 python2 中的 Long。

            >>> a, b, c, d = 20, 5.5, True, 4+3j
            >>> print(type(a), type(b), type(c), type(d))
            <class 'int'> <class 'float'> <class 'bool'> <class 'complex'>
            >>>a = 111
            >>> isinstance(a, int)
            True
            >>>
            • type()不会认为子类是一种父类类型。
            • isinstance()会认为子类是一种父类类型。

            您可以通过使用del语句删除单个或多个对象。例如:

            del var
            del var_a, var_b

            数值的除法包含两个运算符:/ 返回一个浮点数,// 返回一个整数。

            >>> 2 / 4  # 除法,得到一个浮点数
            0.5
            >>> 2 // 4 # 除法,得到一个整数
            0

            字符串

            print (str[0:-1])    # 输出第一个到倒数第二个的所有字符
            str[::-1] # 倒序输出

            Python 使用反斜杠(\)转义特殊字符,如果你不想让反斜杠发生转义,可以在字符串前面添加一个 r,表示原始字符串:

            >>> print(r'Ru\noob')
            Ru\noob

            与 C 字符串不同的是,Python 字符串不能被改变。向一个索引位置赋值,比如word[0] = 'm'会导致错误。

            列表 元组 集合

            print (tinylist * 2)    # 输出两次列表
            print (list + tinylist) # 连接列表

            与Python字符串不一样的是,列表中的元素是可以改变的:

            >>> a
            [9, 2, 13, 14, 15, 6]
            >>> a[2:5] = []   # 将对应的元素值设置为 [] 
            >>> a
            [9, 2, 6]

            元组(tuple)与列表类似,不同之处在于元组的元素不能修改。元组写在小括号 () 里,元素之间用逗号隔开。

            其实,可以把字符串看作一种特殊的元组。

            虽然tuple的元素不可改变,但它可以包含可变的对象,比如list列表。

            构造包含 0 个或 1 个元素的元组比较特殊,所以有一些额外的语法规则:

            tup1 = ()    # 空元组
            tup2 = (20,) # 一个元素,需要在元素后添加逗号

            string、list 和 tuple 都属于 sequence(序列)。

            可以使用大括号 { } 或者 set() 函数创建集合,注意:创建一个空集合必须用 set() 而不是 { },因为 { } 是用来创建一个空字典。

            # set可以进行集合运算
            a = set('abracadabra')
            b = set('alacazam')
            
            print(a)
            print(a - b)     # a 和 b 的差集
            print(a | b)     # a 和 b 的并集
            print(a & b)     # a 和 b 的交集
            print(a ^ b)     # a 和 b 中不同时存在的元素
            
            {'b', 'a', 'c', 'r', 'd'}
            {'b', 'd', 'r'}
            {'l', 'r', 'a', 'c', 'z', 'm', 'b', 'd'}
            {'a', 'c'}
            {'l', 'r', 'z', 'm', 'b', 'd'}

            字典

            dict = {}
            dict['one'] = "1 - 菜鸟教程"
            dict[2]     = "2 - 菜鸟工具"
            tinydict = {'name': 'runoob','code':1, 'site': 'www.runoob.com'}
            print (dict['one'])       # 输出键为 'one' 的值
            print (dict[2])           # 输出键为 2 的值
            print (tinydict)          # 输出完整的字典
            print (tinydict.keys())   # 输出所有键
            print (tinydict.values()) # 输出所有值
            #
            dict_keys(['name', 'code', 'site'])
            dict_values(['runoob', 1, 'www.runoob.com'])

            构造函数 dict() 可以直接从键值对序列中构建字典如下:

            >>>dict([('Runoob', 1), ('Google', 2), ('Taobao', 3)])
            {'Taobao': 3, 'Runoob': 1, 'Google': 2}
            >>> {x: x**2 for x in (2, 4, 6)}
            {2: 4, 4: 16, 6: 36}
            >>> dict(Runoob=1, Google=2, Taobao=3)
            {'Runoob': 1, 'Google': 2, 'Taobao': 3}
            1. 字典是一种映射类型,它的元素是键值对。
            2. 字典的关键字必须为不可变类型,且不能重复。
            3. 创建空字典使用 { }。

            特殊转换

            repr(x)
            将对象 x 转换为表达式字符串
            
            eval(str)
            用来计算在字符串中的有效Python表达式,并返回一个对象
            
            frozenset(s)
            转换为不可变集合
            
            chr(x)
            将一个整数转换为一个字符
            
            ord(x)
            将一个字符转换为它的整数值
            
            hex(x)
            将一个整数转换为一个十六进制字符串
            
            oct(x)
            将一个整数转换为一个八进制字符串

            运算符

            **	幂 - 返回x的y次幂	a**b 为10的21次方
            //	取整除 - 向下取接近除数的整数
            **=	幂赋值运算符	c **= a 等效于 c = c ** a
            //=	取整除赋值运算符	c //= a 等效于 c = c // a
            :=	海象运算符,可在表达式内部为变量赋值。Python3.8 版本新增运算符。	
            在这个示例中,赋值表达式可以避免调用 len() 两次:
            if (n := len(a)) > 10:
                print(f"List is too long ({n} elements, expected <= 10)")

            位运算

            c = a & b;        # 12 = 0000 1100
            print ("1 - c 的值为:", c)
            c = a | b;        # 61 = 0011 1101 
            print ("2 - c 的值为:", c)
            c = a ^ b;        # 49 = 0011 0001
            print ("3 - c 的值为:", c)
            c = ~a;           # -61 = 1100 0011
            print ("4 - c 的值为:", c)
            c = a << 2;       # 240 = 1111 0000
            print ("5 - c 的值为:", c)
            c = a >> 2;       # 15 = 0000 1111
            print ("6 - c 的值为:", c)

            其他

            • 逻辑 and or not
            • 成员 in not in
            • 身份 is is not

            优先级

            **	指数 (最高优先级)
            ~ + -	按位翻转, 一元加号和减号 (最后两个的方法名为 +@ 和 -@)
            * / % //	乘,除,求余数和取整除
            + -	加法减法
            >> <<	右移,左移运算符
            &	位 'AND'
            ^ |	位运算符
            <= < > >=	比较运算符
            == !=	等于运算符
            = %= /= //= -= += *= **=	赋值运算符
            is is not	身份运算符
            in not in	成员运算符
            not and or	逻辑运算符

            Pyhton3 已不支持 <> 运算符,可以使用 != 代替,如果你一定要使用这种比较运算符,可以使用以下的方式:

            >>> from __future__ import barry_as_FLUFL
            >>> 1 <> 2
            True

            数学

            数学函数
            函数	返回值 ( 描述 )
            abs(x)	返回数字的绝对值,如abs(-10) 返回 10
            ceil(x)	返回数字的上入整数,如math.ceil(4.1) 返回 5
            cmp(x, y)
            
            如果 x < y 返回 -1, 如果 x == y 返回 0, 如果 x > y 返回 1。 Python 3 已废弃,使用 (x>y)-(x<y) 替换。
            exp(x)	返回e的x次幂(ex),如math.exp(1) 返回2.718281828459045
            fabs(x)	返回数字的绝对值,如math.fabs(-10) 返回10.0
            floor(x)	返回数字的下舍整数,如math.floor(4.9)返回 4
            log(x)	如math.log(math.e)返回1.0,math.log(100,10)返回2.0
            log10(x)	返回以10为基数的x的对数,如math.log10(100)返回 2.0
            max(x1, x2,...)	返回给定参数的最大值,参数可以为序列。
            min(x1, x2,...)	返回给定参数的最小值,参数可以为序列。
            modf(x)	返回x的整数部分与小数部分,两部分的数值符号与x相同,整数部分以浮点型表示。
            pow(x, y)	x**y 运算后的值。
            round(x [,n])	返回浮点数x的四舍五入值,如给出n值,则代表舍入到小数点后的位数。
            sqrt(x)	返回数字x的平方根。

            随机数

            
            函数	描述
            choice(seq)	从序列的元素中随机挑选一个元素,比如random.choice(range(10)),从0到9中随机挑选一个整数。
            randrange ([start,] stop [,step])	从指定范围内,按指定基数递增的集合中获取一个随机数,基数默认值为 1
            random()	随机生成下一个实数,它在[0,1)范围内。
            seed([x])	改变随机数生成器的种子seed。如果你不了解其原理,你不必特别去设定seed,Python会帮你选择seed。
            shuffle(lst)	将序列的所有元素随机排序
            uniform(x, y)	随机生成下一个实数,它在[x,y]范围内。

            三角函数

            acos(x)	返回x的反余弦弧度值。
            asin(x)	返回x的反正弦弧度值。
            atan(x)	返回x的反正切弧度值。
            atan2(y, x)	返回给定的 X 及 Y 坐标值的反正切值。
            cos(x)	返回x的弧度的余弦值。
            hypot(x, y)	返回欧几里德范数 sqrt(x*x + y*y)。
            sin(x)	返回的x弧度的正弦值。
            tan(x)	返回x弧度的正切值。
            degrees(x)	将弧度转换为角度,如degrees(math.pi/2) , 返回90.0
            radians(x)	将角度转换为弧度

            字符串

            转义字符

            
            转义字符	描述
            \(在行尾时)	续行符
            \\	反斜杠符号
            \'	单引号
            \"	双引号
            \a	响铃
            \b	退格(Backspace)
            \000	空
            \n	换行
            \v	纵向制表符
            \t	横向制表符
            \r	回车
            \f	换页
            \oyy	八进制数,yy 代表的字符,例如:\o12 代表换行,其中 o 是字母,不是数字 0。
            \xyy	十六进制数,yy代表的字符,例如:\x0a代表换行
            \other	其它的字符以普通格式输出

            字符串格式化

            print ("我叫 %s 今年 %d 岁!" % ('小明', 10))
                %c	 格式化字符及其ASCII码
                  %s	 格式化字符串
                  %d	 格式化整数
                  %u	 格式化无符号整型
                  %o	 格式化无符号八进制数
                  %x	 格式化无符号十六进制数
                  %X	 格式化无符号十六进制数(大写)
                  %f	 格式化浮点数字,可指定小数点后的精度
                  %e	 用科学计数法格式化浮点数
                  %E	 作用同%e,用科学计数法格式化浮点数
                  %g	 %f和%e的简写
                  %G	 %f 和 %E 的简写
                  %p	 用十六进制数格式化变量的地址

            格式化操作符辅助指令:

            *	定义宽度或者小数点精度
            -	用做左对齐
            +	在正数前面显示加号( + )
            <sp>	在正数前面显示空格
            #	在八进制数前面显示零('0'),在十六进制前面显示'0x'或者'0X'(取决于用的是'x'还是'X')
            0	显示的数字前面填充'0'而不是默认的空格
            %	'%%'输出一个单一的'%'
            (var)	映射变量(字典参数)
            m.n.	m 是显示的最小总宽度,n 是小数点后的位数(如果可用的话)

            f-string

            f-string 是 python3.6 之后版本添加的,称之为字面量格式化字符串,是新的格式化字符串的语法。

            之前我们习惯用百分号 (%):

            >>> name = 'Runoob'
            >>> 'Hello %s' % name
            'Hello Runoob'

            f-string 格式话字符串以 f 开头,后面跟着字符串,字符串中的表达式用大括号 {} 包起来,它会将变量或表达式计算后的值替换进去,实例如下:

            >>> name = 'Runoob'
            >>> f'Hello {name}'  # 替换变量
            >>> f'{1+2}'         # 使用表达式
            '3'
            >>> w = {'name': 'Runoob', 'url': 'www.runoob.com'}
            >>> f'{w["name"]}: {w["url"]}'
            'Runoob: www.runoob.com'

            用了这种方式明显更简单了,不用再去判断使用 %s,还是 %d。

            在 Python 3.8 的版本中可以使用 = 符号来拼接运算表达式与结果:

            >>> x = 1
            >>> print(f'{x+1}')   # Python 3.6
            2
            >>> x = 1
            >>> print(f'{x+1=}')   # Python 3.8
            'x+1=2'

            Python 的字符串内建函数

            1	
            capitalize()
            将字符串的第一个字符转换为大写
            
            2	
            center(width, fillchar)
            返回一个指定的宽度 width 居中的字符串,fillchar 为填充的字符,默认为空格。
            
            3	
            count(str, beg= 0,end=len(string))
            返回 str 在 string 里面出现的次数,如果 beg 或者 end 指定则返回指定范围内 str 出现的次数
            
            4	
            bytes.decode(encoding="utf-8", errors="strict")
            Python3 中没有 decode 方法,但我们可以使用 bytes 对象的 decode() 方法来解码给定的 bytes 对象,这个 bytes 对象可以由 str.encode() 来编码返回。
            
            5	
            encode(encoding='UTF-8',errors='strict')
            以 encoding 指定的编码格式编码字符串,如果出错默认报一个ValueError 的异常,除非 errors 指定的是'ignore'或者'replace'
            
            6	
            endswith(suffix, beg=0, end=len(string))
            检查字符串是否以 obj 结束,如果beg 或者 end 指定则检查指定的范围内是否以 obj 结束,如果是,返回 True,否则返回 False.
            
            7	
            expandtabs(tabsize=8)
            把字符串 string 中的 tab 符号转为空格,tab 符号默认的空格数是 8 。
            
            8	
            find(str, beg=0, end=len(string))
            检测 str 是否包含在字符串中,如果指定范围 beg 和 end ,则检查是否包含在指定范围内,如果包含返回开始的索引值,否则返回-1
            
            9	
            index(str, beg=0, end=len(string))
            跟find()方法一样,只不过如果str不在字符串中会报一个异常.
            
            10	
            isalnum()
            如果字符串至少有一个字符并且所有字符都是字母或数字则返 回 True,否则返回 False
            
            11	
            isalpha()
            如果字符串至少有一个字符并且所有字符都是字母则返回 True, 否则返回 False
            
            12	
            isdigit()
            如果字符串只包含数字则返回 True 否则返回 False..
            
            13	
            islower()
            如果字符串中包含至少一个区分大小写的字符,并且所有这些(区分大小写的)字符都是小写,则返回 True,否则返回 False
            
            14	
            isnumeric()
            如果字符串中只包含数字字符,则返回 True,否则返回 False
            
            15	
            isspace()
            如果字符串中只包含空白,则返回 True,否则返回 False.
            
            16	
            istitle()
            如果字符串是标题化的(见 title())则返回 True,否则返回 False
            
            17	
            isupper()
            如果字符串中包含至少一个区分大小写的字符,并且所有这些(区分大小写的)字符都是大写,则返回 True,否则返回 False
            
            18	
            join(seq)
            以指定字符串作为分隔符,将 seq 中所有的元素(的字符串表示)合并为一个新的字符串
            
            19	
            len(string)
            返回字符串长度
            
            20	
            ljust(width[, fillchar])
            返回一个原字符串左对齐,并使用 fillchar 填充至长度 width 的新字符串,fillchar 默认为空格。
            
            21	
            lower()
            转换字符串中所有大写字符为小写.
            
            22	
            lstrip()
            截掉字符串左边的空格或指定字符。
            
            23	
            maketrans()
            创建字符映射的转换表,对于接受两个参数的最简单的调用方式,第一个参数是字符串,表示需要转换的字符,第二个参数也是字符串表示转换的目标。
            
            24	
            max(str)
            返回字符串 str 中最大的字母。
            
            25	
            min(str)
            返回字符串 str 中最小的字母。
            
            26	
            replace(old, new [, max])
            把 将字符串中的 str1 替换成 str2,如果 max 指定,则替换不超过 max 次。
            
            27	
            rfind(str, beg=0,end=len(string))
            类似于 find()函数,不过是从右边开始查找.
            
            28	
            rindex( str, beg=0, end=len(string))
            类似于 index(),不过是从右边开始.
            
            29	
            rjust(width,[, fillchar])
            返回一个原字符串右对齐,并使用fillchar(默认空格)填充至长度 width 的新字符串
            
            30	
            rstrip()
            删除字符串字符串末尾的空格.
            
            31	
            split(str="", num=string.count(str))
            num=string.count(str)) 以 str 为分隔符截取字符串,如果 num 有指定值,则仅截取 num+1 个子字符串
            
            32	
            splitlines([keepends])
            按照行('\r', '\r\n', \n')分隔,返回一个包含各行作为元素的列表,如果参数 keepends 为 False,不包含换行符,如果为 True,则保留换行符。
            
            33	
            startswith(substr, beg=0,end=len(string))
            检查字符串是否是以指定子字符串 substr 开头,是则返回 True,否则返回 False。如果beg 和 end 指定值,则在指定范围内检查。
            
            34	
            strip([chars])
            在字符串上执行 lstrip()和 rstrip()
            
            35	
            swapcase()
            将字符串中大写转换为小写,小写转换为大写
            
            36	
            title()
            返回"标题化"的字符串,就是说所有单词都是以大写开始,其余字母均为小写(见 istitle())
            
            37	
            translate(table, deletechars="")
            根据 str 给出的表(包含 256 个字符)转换 string 的字符, 要过滤掉的字符放到 deletechars 参数中
            
            38	
            upper()
            转换字符串中的小写字母为大写
            
            39	
            zfill (width)
            返回长度为 width 的字符串,原字符串右对齐,前面填充0
            
            40	
            isdecimal()
            检查字符串是否只包含十进制字符,如果是返回 true,否则返回 false。

            strip() 方法

            str = "00000003210Runoob01230000000"; 
            print str.strip( '0' );  # 去除首尾字符 0
            str2 = "   Runoob      ";   # 去除首尾空格
            print str2.strip();
            # 下例演示了只要头尾包含有指定字符序列中的字符就删除:
            str = "123abcrunoob321"
            print (str.strip( '12' ))  # 字符序列为 12
            # 以上实例输出结果如下:
            3abcrunoob3

            replace() 函数

            str = "this is string example....wow!!! this is really string";
            print str.replace("is", "was");
            print str.replace("is", "was", 3);
            # 以上实例输出结果如下:
            thwas was string example....wow!!! thwas was really string
            thwas was string example....wow!!! thwas is really string

            列表

            可以使用 del 语句来删除列表的的元素,如下实例:

            list = ['Google', 'Runoob', 1997, 2000]
            print ("原始列表 : ", list)
            del list[2]
            print ("删除第三个元素 : ", list)
            # 以上实例输出结果:
            原始列表 :  ['Google', 'Runoob', 1997, 2000]
            删除第三个元素 :  ['Google', 'Runoob', 2000]

            方法

            1	list.append(obj)
            在列表末尾添加新的对象
            2	list.count(obj)
            统计某个元素在列表中出现的次数
            3	list.extend(seq)
            在列表末尾一次性追加另一个序列中的多个值(用新列表扩展原来的列表)
            4	list.index(obj)
            从列表中找出某个值第一个匹配项的索引位置
            5	list.insert(index, obj)
            将对象插入列表
            6	list.pop([index=-1])
            移除列表中的一个元素(默认最后一个元素),并且返回该元素的值
            7	list.remove(obj)
            移除列表中某个值的第一个匹配项
            8	list.reverse()
            反向列表中元素
            9	list.sort( key=None, reverse=False)
            对原列表进行排序
            10	list.clear()
            清空列表
            11	list.copy()
            复制列表

            关于元组是不可变的

            所谓元组的不可变指的是元组所指向的内存中的内同不可变。

            >>> tup = ('r', 'u', 'n', 'o', 'o', 'b')
            >>> tup[0] = 'g'     # 不支持修改元素
            Traceback (most recent call last):
              File "<stdin>", line 1, in <module>
            TypeError: 'tuple' object does not support item assignment
            >>> id(tup)     # 查看内存地址
            4440687904
            >>> tup = (1,2,3)
            >>> id(tup)
            4441088800    # 内存地址不一样了

            从以上实例可以看出,重新赋值的元组 tup,绑定到新的对象了,不是修改了原来的对象。

            删除字典

            del dict['Name'] # 删除键 'Name'
            dict.clear()     # 清空字典
            del dict         # 删除字典

            字典方法

            1	radiansdict.clear()
            删除字典内所有元素
            2	radiansdict.copy()
            返回一个字典的浅复制
            3	radiansdict.fromkeys()
            创建一个新字典,以序列seq中元素做字典的键,val为字典所有键对应的初始值
            4	radiansdict.get(key, default=None)
            返回指定键的值,如果值不在字典中返回default值
            5	key in dict
            如果键在字典dict里返回true,否则返回false
            6	radiansdict.items()
            以列表返回可遍历的(键, 值) 元组数组
            7	radiansdict.keys()
            返回一个迭代器,可以使用 list() 来转换为列表
            8	radiansdict.setdefault(key, default=None)
            和get()类似, 但如果键不存在于字典中,将会添加键并将值设为default
            9	radiansdict.update(dict2)
            把字典dict2的键/值对更新到dict里
            10	radiansdict.values()
            返回一个迭代器,可以使用 list() 来转换为列表
            11	pop(key[,default])
            删除字典给定键 key 所对应的值,返回值为被删除的值。key值必须给出。 否则,返回default值。
            12	popitem()
            随机返回并删除字典中的最后一对键和值。

            集合

            s.add( x ) # 将元素 x 添加到集合 s 中,如果元素已存在,则不进行任何操作。
            s.update( x ) # 也可以添加元素,且参数可以是列表,元组,字典等
            s.remove( x ) # 将元素 x 从集合 s 中移除,如果元素不存在,则会发生错误。
            s.discard( x ) # 移除集合中的元素,且如果元素不存在,不会发生错误。
            s.pop()  # 随机删除集合中的一个元素

            流程

            迭代器与生成器

            >>> list=[1,2,3,4]
            >>> it = iter(list)    # 创建迭代器对象
            >>> print (next(it))   # 输出迭代器的下一个元素
            1
            >>> print (next(it))
            2
            >>>
            #!/usr/bin/python3
             
            import sys         # 引入 sys 模块
             
            list=[1,2,3,4]
            it = iter(list)    # 创建迭代器对象
             
            while True:
                try:
                    print (next(it))
                except StopIteration:
                    sys.exit()

            把一个类作为一个迭代器使用需要在类中实现两个方法 iter() 与 next() 。

            class MyNumbers:
              def __iter__(self):
                self.a = 1
                return self
             
              def __next__(self):
                x = self.a
                self.a += 1
                return x

            StopIteration 异常用于标识迭代的完成,防止出现无限循环的情况,在 next() 方法中我们可以设置在完成指定循环次数后触发 StopIteration 异常来结束迭代。

            class MyNumbers:
              def __iter__(self):
                self.a = 1
                return self
             
              def __next__(self):
                if self.a <= 20:
                  x = self.a
                  self.a += 1
                  return x
                else:
                  raise StopIteration
             
            myclass = MyNumbers()
            myiter = iter(myclass)
             
            for x in myiter:
              print(x)

            生成器

            在 Python 中,使用了 yield 的函数被称为生成器(generator)。

            跟普通函数不同的是,生成器是一个返回迭代器的函数,只能用于迭代操作,更简单点理解生成器就是一个迭代器。

            在调用生成器运行的过程中,每次遇到 yield 时函数会暂停并保存当前所有的运行信息,返回 yield 的值, 并在下一次执行 next() 方法时从当前位置继续运行。

            调用一个生成器函数,返回的是一个迭代器对象。

            以下实例使用 yield 实现斐波那契数列:

            #!/usr/bin/python3
             
            import sys
             
            def fibonacci(n): # 生成器函数 - 斐波那契
                a, b, counter = 0, 1, 0
                while True:
                    if (counter > n): 
                        return
                    yield a
                    a, b = b, a + b
                    counter += 1
            f = fibonacci(10) # f 是一个迭代器,由生成器返回生成
             
            while True:
                try:
                    print (next(f), end=" ")
                except StopIteration:
                    sys.exit()

            执行以上程序,输出结果如下:0 1 1 2 3 5 8 13 21 34 55

            函数

            python 函数的参数传递:

            • 不可变类型:类似 c++ 的值传递,如 整数、字符串、元组。如fun(a),传递的只是a的值,没有影响a对象本身。比如在 fun(a)内部修改 a 的值,只是修改另一个复制的对象,不会影响 a 本身。
            • 可变类型:类似 c++ 的引用传递,如 列表,字典。如 fun(la),则是将 la 真正的传过去,修改后fun外部的la也会受影响
            # 默认参数
            def printinfo( name, age = 35 ):
            # 不定长参数
            def printinfo( arg1, *vartuple ):
            def functionname([formal_args,] **var_args_dict ):

            Python3.8 新增了一个函数形参语法 / 用来指明函数形参必须使用指定位置参数,不能使用关键字参数的形式。

            列表

            用 append() 方法可以把一个元素添加到堆栈顶。用不指定索引的 pop() 方法可以把一个元素从堆栈顶释放出来。

            >>> stack = [3, 4, 5]
            >>> stack.append(6)
            >>> stack.append(7)
            >>> stack
            [3, 4, 5, 6, 7]
            >>> stack.pop()
            7
            >>> stack
            [3, 4, 5, 6]
            >>> stack.pop()
            6
            >>> stack.pop()
            5
            >>> stack
            [3, 4]m collections import deque
            >>> queue = deque(["Eric", "John", "Michael"])
            >>> queue.append("Terry")           # Terry arrives
            >>> queue.append("Graham")          # Graham arrives
            >>> queue.popleft()                 # The first to arrive now leaves
            'Eric'
            >>> queue.popleft()                 # The second to arrive now leaves
            'John'
            >>> queue                           # Remaining queue in order of arrival
            deque(['Michael', 'Terry', 'Graham'])

            遍历技巧

            在字典中遍历时,关键字和对应的值可以使用 items() 方法同时解读出来:

            >>> knights = {'gallahad': 'the pure', 'robin': 'the brave'}
            >>> for k, v in knights.items():
            ...     print(k, v)
            ...
            gallahad the pure
            robin the brave

            在序列中遍历时,索引位置和对应值可以使用 enumerate() 函数同时得到:

            >>> for i, v in enumerate(['tic', 'tac', 'toe']):
            ...     print(i, v)
            ...
            0 tic
            1 tac
            2 toe

            同时遍历两个或更多的序列,可以使用 zip() 组合:

            >>> questions = ['name', 'quest', 'favorite color']
            >>> answers = ['lancelot', 'the holy grail', 'blue']
            >>> for q, a in zip(questions, answers):
            ...     print('What is your {0}?  It is {1}.'.format(q, a))
            ...
            What is your name?  It is lancelot.
            What is your quest?  It is the holy grail.
            What is your favorite color?  It is blue.

            要反向遍历一个序列,首先指定这个序列,然后调用 reversed() 函数:

            >>> for i in reversed(range(1, 10, 2)):
            ...     print(i)
            ...
            9
            7
            5
            3
            1

            要按顺序遍历一个序列,使用 sorted() 函数返回一个已排序的序列,并不修改原值:

            >>> basket = ['apple', 'orange', 'apple', 'pear', 'orange', 'banana']
            >>> for f in sorted(set(basket)):
            ...     print(f)
            ...
            apple
            banana
            orange
            pear

            模块

            if __name__ == '__main__':
               print('程序自身在运行')

            文件

            f = open("/tmp/foo.txt", "w")
            f.write( "Python 是一个非常好的语言。\n是的,的确非常好!!\n" )
            # 关闭打开的文件
            f.close()

            方法

            f.read()
            为了读取一个文件的内容,调用 f.read(size), 这将读取一定数目的数据, 然后作为字符串或字节对象返回。
            size 是一个可选的数字类型的参数。 当 size 被忽略了或者为负, 那么该文件的所有内容都将被读取并且返回。
            
            f.readline()
            f.readline() 会从文件中读取单独的一行。换行符为 '\n'。f.readline() 如果返回一个空字符串, 说明已经已经读取到最后一行。
            
            f.readlines()
            f.readlines() 将返回该文件中包含的所有行。(list)
            如果设置可选参数 sizehint, 则读取指定长度的字节, 并且将这些字节按行分割。
            
            另一种方式是迭代一个文件对象然后读取每行:
            for line in f:
                print(line, end='')
            
            f.write()
            f.write(string) 将 string 写入到文件中, 然后返回写入的字符数。
            
            如果要写入一些不是字符串的东西, 那么将需要先进行转换:
            value = ('www.runoob.com', 14)
            s = str(value)
            f.write(s)
            
            f.tell()
            f.tell() 返回文件对象当前所处的位置, 它是从文件开头开始算起的字节数。
            
            f.seek()
            如果要改变文件当前的位置, 可以使用 f.seek(offset, from_what) 函数。
            seek(x,0) : 从起始位置即文件首行首字符开始移动 x 个字符
            seek(x,1) : 表示从当前位置往后移动x个字符
            seek(-x,2):表示从文件的结尾往前移动x个字符
            
            f.close()
            在文本文件中 (那些打开文件的模式下没有 b 的), 只会相对于文件起始位置进行定位。
            
            当处理一个文件对象时, 使用 with 关键字是非常好的方式。在结束后, 它会帮你正确的关闭文件。 而且写起来也比 try - finally 语句块要简短:
            >>> with open('/tmp/foo.txt', 'r') as f:
            ...     read_data = f.read()
            >>> f.closed
            
            !!! pickle 模块
            
            python的pickle模块实现了基本的数据序列和反序列化。
            
            ```python
            pickle.dump(obj, file, [,protocol])
            x = pickle.load(file)

            异常

            最后一个except子句可以忽略异常的名称,它将被当作通配符使用。你可以使用这种方法打印一个错误信息,然后再次把异常抛出。

            import sys
             
            try:
                f = open('myfile.txt')
                s = f.readline()
                i = int(s.strip())
            except OSError as err:
                print("OS error: {0}".format(err))
            except ValueError:
                print("Could not convert data to an integer.")
            except:
                print("Unexpected error:", sys.exc_info()[0])
                raise

            try/except 语句还有一个可选的 else 子句,如果使用这个子句,那么必须放在所有的 except 子句之后。 else 子句将在 try 子句没有发生任何异常的时候执行。

            try-finally 语句无论是否发生异常都将执行最后的代码。

            用户自定义异常

            你可以通过创建一个新的异常类来拥有自己的异常。异常类继承自 Exception 类,可以直接继承,或者间接继承,例如:

            >>>class MyError(Exception):
                    def __init__(self, value):
                        self.value = value
                    def __str__(self):
                        return repr(self.value)

            一些对象定义了标准的清理行为,无论系统是否成功的使用了它,一旦不需要它了,那么这个标准的清理行为就会执行。

            关键词 with 语句就可以保证诸如文件之类的对象在使用完之后一定会正确的执行他的清理方法

            面向对象

            Python同样有限的支持多继承形式。多继承的类定义形如下例:

            class DerivedClassName(Base1, Base2, Base3):
                <statement-1>
                .
                .
                .
                <statement-N>

            类的私有属性 __private_attrs:两个下划线开头,声明该属性为私有,不能在类的外部被使用或直接访问。在类内部的方法中使用时 self.__private_attrs

            类的私有方法实例如下:

            #!/usr/bin/python3
             
            class Site:
                def __init__(self, name, url):
                    self.name = name       # public
                    self.__url = url   # private
             
                def who(self):
                    print('name  : ', self.name)
                    print('url : ', self.__url)
             
                def __foo(self):          # 私有方法
                    print('这是私有方法')
             
                def foo(self):            # 公共方法
                    print('这是公共方法')
                    self.__foo()
             
            x = Site('菜鸟教程', 'www.runoob.com')
            x.who()        # 正常输出
            x.foo()        # 正常输出
            x.__foo()      # 报错

            运算符重载

            class Vector:
               def __init__(self, a, b):
                  self.a = a
                  self.b = b
             
               def __str__(self):
                  return 'Vector (%d, %d)' % (self.a, self.b)
               
               def __add__(self,other):
                  return Vector(self.a + other.a, self.b + other.b)
             
            v1 = Vector(2,10)
            v2 = Vector(5,-2)
            print (v1 + v2)
            
            # 以上代码执行结果如下所示:
            Vector(7,8)

            作用域

            global 和 nonlocal关键字

            内部作用域想修改外部作用域的变量时,就要用到global和nonlocal关键字了。

            以下实例修改全局变量 num:

            num = 1
            def fun1():
                global num  # 需要使用 global 关键字声明
                print(num) 
                num = 123
                print(num)
            fun1()
            print(num)
            
            # 以上实例输出结果:
            1
            123
            123

            如果要修改嵌套作用域(enclosing 作用域,外层非全局作用域)中的变量则需要 nonlocal 关键字了,如下实例:

            #!/usr/bin/python3
             
            def outer():
                num = 10
                def inner():
                    nonlocal num   # nonlocal关键字声明
                    num = 100
                    print(num)
                inner()
                print(num)
            outer()
            
            # 以上实例输出结果:
            100
            100

            网络编程

            socket()函数

            Python 中,我们用 socket()函数来创建套接字,语法格式如下:

            socket.socket([family[, type[, proto]]])
            参数
            family: 套接字家族可以使AF_UNIX或者AF_INET
            type: 套接字类型可以根据是面向连接的还是非连接分为SOCK_STREAM或SOCK_DGRAM
            protocol: 一般不填默认为0.
            Socket 对象(内建)方法
            函数	描述
            服务器端套接字
            s.bind()	绑定地址(host,port)到套接字, 在AF_INET下,以元组(host,port)的形式表示地址。
            s.listen()	开始TCP监听。backlog指定在拒绝连接之前,操作系统可以挂起的最大连接数量。该值至少为1,大部分应用程序设为5就可以了。
            s.accept()	被动接受TCP客户端连接,(阻塞式)等待连接的到来
            客户端套接字
            s.connect()	主动初始化TCP服务器连接,。一般address的格式为元组(hostname,port),如果连接出错,返回socket.error错误。
            s.connect_ex()	connect()函数的扩展版本,出错时返回出错码,而不是抛出异常
            公共用途的套接字函数
            s.recv()	接收TCP数据,数据以字符串形式返回,bufsize指定要接收的最大数据量。flag提供有关消息的其他信息,通常可以忽略。
            s.send()	发送TCP数据,将string中的数据发送到连接的套接字。返回值是要发送的字节数量,该数量可能小于string的字节大小。
            s.sendall()	完整发送TCP数据,完整发送TCP数据。将string中的数据发送到连接的套接字,但在返回之前会尝试发送所有数据。成功返回None,失败则抛出异常。
            s.recvfrom()	接收UDP数据,与recv()类似,但返回值是(data,address)。其中data是包含接收数据的字符串,address是发送数据的套接字地址。
            s.sendto()	发送UDP数据,将数据发送到套接字,address是形式为(ipaddr,port)的元组,指定远程地址。返回值是发送的字节数。
            s.close()	关闭套接字
            s.getpeername()	返回连接套接字的远程地址。返回值通常是元组(ipaddr,port)。
            s.getsockname()	返回套接字自己的地址。通常是一个元组(ipaddr,port)
            s.setsockopt(level,optname,value)	设置给定套接字选项的值。
            s.getsockopt(level,optname[.buflen])	返回套接字选项的值。
            s.settimeout(timeout)	设置套接字操作的超时期,timeout是一个浮点数,单位是秒。值为None表示没有超时期。一般,超时期应该在刚创建套接字时设置,因为它们可能用于连接的操作(如connect())
            s.gettimeout()	返回当前超时期的值,单位是秒,如果没有设置超时期,则返回None。
            s.fileno()	返回套接字的文件描述符。
            s.setblocking(flag)	如果flag为0,则将套接字设为非阻塞模式,否则将套接字设为阻塞模式(默认值)。非阻塞模式下,如果调用recv()没有发现任何数据,或send()调用无法立即发送数据,那么将引起socket.error异常。
            s.makefile()	创建一个与该套接字相关连的文件

            实例

            #!/usr/bin/python3
            # 文件名:server.py
            
            # 导入 socket、sys 模块
            import socket
            import sys
            
            # 创建 socket 对象
            serversocket = socket.socket(
                        socket.AF_INET, socket.SOCK_STREAM) 
            
            # 获取本地主机名
            host = socket.gethostname()
            
            port = 9999
            
            # 绑定端口号
            serversocket.bind((host, port))
            
            # 设置最大连接数,超过后排队
            serversocket.listen(5)
            
            while True:
                # 建立客户端连接
                clientsocket,addr = serversocket.accept()      
            
                print("连接地址: %s" % str(addr))
                
                msg='欢迎访问菜鸟教程!'+ "\r\n"
                clientsocket.send(msg.encode('utf-8'))
                clientsocket.close()
            #!/usr/bin/python3
            # 文件名:client.py
            
            # 导入 socket、sys 模块
            import socket
            import sys
            
            # 创建 socket 对象
            s = socket.socket(socket.AF_INET, socket.SOCK_STREAM) 
            
            # 获取本地主机名
            host = socket.gethostname() 
            
            # 设置端口号
            port = 9999
            
            # 连接服务,指定主机和端口
            s.connect((host, port))
            
            # 接收小于 1024 字节的数据
            msg = s.recv(1024)
            
            s.close()
            
            print (msg.decode('utf-8'))

            QuickSetup

            1st May 2021 at 8:37am

            QuickSetup-1.jpg

            Read from CSV File

            Mohammad11th April 2021 at 6:01pm
            solution

            Recent Tab and Bold Timeline

            Mohammad11th April 2021 at 6:01pm
            exmp030 solution
            How can I make it so that in the Recent tab the dates in which the tiddlers are ordered appear highlighted in bold?
            Use customized style sheet
            1. Create a new tiddler
            2. Tag it with $:/tags/Stylesheet
            3. Put the below css inside it

              /* Recent tab */
              .tc-sidebar-lists .tc-timeline {
                 font-weight: bold;
              }
            4. Save and see the result

            See Example 30: Colored Timeline

            How to add bullets or other symbols at the begining of each timeline entry?

            As explained by Mat, create a tiddler tagged with $:/tags/Stylesheet with below contents

            .tc-timeline .tc-menu-list-subitem::before {content:"⦁ ⚬ ●"}

            This causes every entry starts with ⦁ ⚬ ●. The below example adds - prefix to each entry

            .tc-timeline .tc-menu-list-subitem::before {content:"&nbsp; -"}

            Regexp to Find all Tiddlers with .ext in Their Name

            Mohammad11th April 2021 at 6:01pm
            exmp006 regexp-tutorial solution

            A macro to list all tiddlers with a .ext extenstion in their name using the regexp. The name can have any alpha-numeric character(e.g. a-z, A-Z, 0-9)

            • Change ext with any extension you like
            • This example shows how regexp can be used in filters
            • Macro
            \define myregexp() ^([a-zA-Z0-9]+\.)*[ext]+$
            • Example
            <<list-links "[regexp<myregexp>!sort[]]">>
            • Results


              Related tiddlers

              Remove Blue Border from Button

              Mohammad11th April 2021 at 6:01pm
              solution
              When click a button in Chrome or Opera, a blue frame (border) is appeared, how to remove it?
              1. Create a tiddler, name it what you want
              2. Tag it with $:/tags/STylesheet
              3. Add the following as text
              .tc-btn-invisible { outline:none; }

              Remove Index with Zero Value

              Mohammad11th April 2021 at 6:01pm
              datatiddler exmp093 solution
              How display properties (index/value) of a data tiddler with an optional delete buttom to remove indexes with zero value?
              Using Tiddlywiki 5.1.20+ it is possible to employ the match filter operator to locate indexes with zero value.

              Solution

              This solution contains three macros

              Remarks
              show-idx-val is the main macro to be called. It uses deleteAllzeros to show a button to delete all indexes with zero value. A nested $list widgets to read indexes and then extract values and compare against zero. In then display each index has a value of 0 with a delete button.
              deleteIdx, a macro creates a button to delete an index
              deleteAllzeros a macro delete all indexes have zero value using action-setfield widget

              Example

              Remove Surrounding Quotes

              Mohammad11th April 2021 at 6:01pm
              else solution

              Using the ELSE run filter prefix

              The below code is a demo of ELSE run ~ filter prefix. It's purpose here is to get a parameter and remove its surrounding single or souble quotes. If the parameter has not any surrounding quotes, then returns itself.

              Macro

              \define remove-quotes(term)
              <$set name="item" value=<<__term__>> >
                <$set name="noquote"
                  value={{{ [<item>removeprefix["]removesuffix["]] [<item>removeprefix[']removesuffix[']] ~[<item>] }}}
                  emptyValue="Process failed!"
                </$set>
              </$set>
              \end

              Examples

              Remove single quotes

              Remove double quotes

              Empty value

              The macro will return the Process failed! if no parameter passed

              Replace or Rename Fields

              Mohammad11th April 2021 at 6:01pm
              exmp104 solution
              How to rename a field in bunch of tiddlers from an old name to a new one?
              Use the two widgets action-setfield and action-deletefield

              Code

              The below code shows how to rename the field alias to aliases

              How it works
              find all tiddlers has a field called alias
              copy the content of alias field to a new field aliases
              delete the old field alias

              Note that the macro show-tiddlers is a helper macro to list the tiddlers has alias field name and then aliases field name. This is used just for displaying the result.

              Example

              Rewrite of TOC Macro

              Mohammad11th April 2021 at 6:01pm
              solution tocxx
              How is it possible to hide some toc levels in TW table of contents? In other words how you can customize the levels of TOC? or how you can limits the TOC up to level three?

              It seems the TW core macro toc-selective-expandable has not the capabilities to do this! A solution has been proposed by Mark S and he has rewritten the core macro as below

              Details of code

              \define toc-linked-selective-expandable-body(tag,sort:"",itemClassFilter:" ",exclude,path,prune:"")
              <$set name="toc-state" value=<<qualify """$:/state/toc$path$-$(currentTiddler)$""">>>
                <$set name="toc-item-class" filter="""$itemClassFilter$""" emptyValue="toc-item" value="toc-item-selected" >
              <$set name="prune" value="""$prune$""">
                  <li class=<<toc-item-class>>>
                    <$link>
                        <$list filter="[all[current]]  -[enlist<prune>] +[tagging[]limit[1]]" variable="ignore" scratch="-[enlist<prune>]" emptyMessage="<$button class='tc-btn-invisible'>{{$:/core/images/blank}}</$button>">
                        <$reveal type="nomatch" state=<<toc-state>> text="open">
                          <$button set=<<toc-state>> setTo="open" class="tc-btn-invisible tc-popup-keep">
                            {{$:/core/images/right-arrow}}
                          </$button>
                        </$reveal>
                        <$reveal type="match" state=<<toc-state>> text="open">
                          <$button set=<<toc-state>> setTo="close" class="tc-btn-invisible tc-popup-keep">
                            {{$:/core/images/down-arrow}}
                          </$button>
                        </$reveal>
                      </$list>
                      <<toc-caption>>
                    </$link>
                    <$reveal type="match" state=<<toc-state>> text="open">
                      <$macrocall $name="toc-selective-expandable" tag=<<currentTiddler>> sort="""$sort$""" itemClassFilter="""$itemClassFilter$""" exclude="""$exclude$""" path="""$path$""" prune="""$prune$"""/>
                    </$reveal>
                  </li>
              </$set>
                </$set>
              </$set>
              \end
              
              
              \define toc-selective-expandable-empty-message()
              <<toc-linked-selective-expandable-body tag:"""$(tag)$""" sort:"""$(sort)$""" itemClassFilter:"""$(itemClassFilter)$""" exclude:"""$(excluded)$""" path:"""$(path)$""" prune:"""$(prune)$""">>
              \end
              
              \define toc-selective-expandable(tag,sort:"",itemClassFilter,exclude,path,prune)
              <$vars tag="""$tag$""" sort="""$sort$""" itemClassFilter="""$itemClassFilter$""" excluded="""$exclude$ -[[$tag$]]""" path="""$path$/$tag$""" prune="""$prune$""" >
                <ol class="tc-toc toc-selective-expandable">
                  <$list filter="""[all[shadows+tiddlers]tag[$tag$]!has[draft.of]$sort$] -[[$tag$]] $exclude$""">
                    <$list filter="[all[current]toc-link[no]]" variable="ignore" emptyMessage=<<toc-selective-expandable-empty-message>> >
                      <$macrocall $name=toc-unlinked-selective-expandable-body tag="""$tag$""" sort="""$sort$""" itemClassFilter="""$itemClassFilter$""" exclude=<<excluded>> path=<<path>> prune="""$prune$""" >
                    </$list>
                  </$list>
                </ol>
              </$vars>
              \end

              Example

              If used at https://TiddlyWiki.com will show the standard table of contents, but "Learning" and "Drag and Drop" (under Features) will both be links – not expandable branches.

              <div class="tc-table-of-contents">
              <<toc-selective-expandable "TableOfContents" prune:"Learning [[Drag and Drop]]">>
              </div>

              Sample JavaScript Code

              Mohammad11th April 2021 at 6:01pm
              solution

              Save the Filter Output

              Mohammad11th April 2021 at 6:01pm
              solution
              How the filter output can be saved for further use?

              Using the set widget it is possible to save the output of a filter run.

              <$set name="output" filter="[tag[Filter Operators]first[5]]"> 
               
              Text of variable: <$text text=<<output>>/> 
               
              List of titles: <$macrocall $name="list-links" filter=<<output>>/> 
               
              </$set>
              • Example

              The below example run a filter and save its results into a variable called output, it then is used in another operation.

              Save Tiddlywiki

              Mohammad24th April 2021 at 10:24am
              LearningTiddlyWiki Save solution

              For security reasons, modern web browsers do not let you directly write to the local filesystem.

              TiddlyWiki is built on top of browser tech. As such, it has the same restrictions on local filesystem access.

              Fortunately, nearly all web browsers DO have one reliable method of writing to the local filesystem: downloading a file.

              Downloading offers some measure of implicit information privacy/security because it requires user-interaction (no silent saving of files), and uses system-level dialogs to access the filesystem (no direct program access to read your directory info).

              By default, when you try to save a locally-stored TiddlyWiki without any add-ons or helper apps, it triggers what appears to be a download activity, even though the file is clearly already on your own system.

              Many browsers automatically save downloaded files to a specific location (e.g., "/Downloads" or similar).

              Some browsers allow you to change this default location to a different directory and/or "ask for location" each time you download so you can specify the desired filename and directory.

              If you tell your browser to point to the directory in which your TiddlyWiki file is stored, then when you press "save", you get a system-level dialog that allows you to enter a new filename or select an existing file.

              Most systems will automatically suggest a filename by appending a number to the current filename, e.g., "index.html (1)". You can, of course, select the *existing* TiddlyWiki filename, e.g., index.html (without any "(n)" suffix), which should then prompt you for permission to overwrite the previously saved file. After saving, if you reload your TiddlyWiki file, it will contain your saved changes as you would expect.

              Although the "default download saver" ultimately does let you save changes locally, some people find the experience to be less-than-optimal. To address this, there are many different add-ons and system-specific helper apps that can potentially provide a smoother experience, depending upon your usage patterns and platform(s) of choice.

              https://tiddlywiki.com/#GettingStarted

              Scroll to top when click on a tiddler in storyriver

              Mohammad11th April 2021 at 6:01pm
              solution

              Search DataTiddler Using regexp

              Mohammad11th April 2021 at 6:01pm
              datatiddler solution
              How to search a DataTiddler indexes using the regexp?

              The below solution is proposed by Stephan Hradek to use regexp for searching a DataTiddler.

              It uses a macro with a default DataTiddler. It enables you to make the search using regexp filter instead of requiring the exact name.

              \define thisSearchMacro(search:"", dataTid:"exmp039/acronyms/web")
              <ol>
              <$list filter="[[$dataTid$]indexes[]regexp:title[(?i)$search$]]">
              <li><<currentTiddler>>: <$transclude tiddler="$dataTid$" index=<<currentTiddler>>/></li>
              </$list>
              </ol>
              \end

              Remarks

              filter explanation:

              1. Get your DataTiddler (the default is exmp039/acronyms/web)
              2. Get its indexes
              3. Filter them by your search string
              4. For each remaining transclude the content

              Example i

              Search the defualt DataTiddler (exmp039/acronyms/web) for ftp

              Example ii

              Search the exmp039/roman-numbers DataTiddler for f. This will list every index has the letter f in its name.

              Search in Fields

              Mohammad11th April 2021 at 6:01pm
              solution

              Search in fields is a a solution by Stephan Hradek that adds an additional tab to Advanced Search allowing you to search in field contents.

              Note: By default the text field, i.e. the tiddler body is excluded from search in fields. If you want to search only the text field you have to specifically select it.

              Search in Local Wiki Files

              Mohammad11th April 2021 at 6:01pm
              solution

              Assume you have several local wiki files stored in different places in your disks (thumb drive, hard disks, local networks) and you want to search all of them from inside a main wiki (the one you normally work with), how to do this?

              To search local file you need these parts

              1. A dictionary tiddler to store the full path to the local wikis
              2. A user interface (UI) tiddler includes
                • a textbox to get the keyword to search
                • a set of checkbox to customize search
                • a set of macro to make the links to local wiki files

              Example

              Here an example is given.

              • The user interface (UI) tiddler to get the keyword, customize search and create the links Search Local TWs.

              See it in action

              • Import (by drag and drop) the below tiddlers to your wiki
                1. Search Local TWs
                2. dictionary/mylocal-TWs
              • Edit the conetnts of dictionary/mylocal-TWs to meet your requirements. Note to the path and name of your local wikis. You can open your local wiki in browser and then copy its full path from browser address bar.
              • Open Search Local TWs and input a keywords and click on the links created below the textbox.
              • That's all.

              Search in Tags

              Mohammad11th April 2021 at 6:01pm
              solution

              To search amoung the tags in a wiki:

              Search Operator and Variables

              Mohammad11th April 2021 at 6:01pm
              solution

              Specially document using filter in $var and difference with $set

              Select among Three Tiddlers with Priority

              Mohammad11th April 2021 at 6:01pm
              solution

              How to select among three tiddlers in below priority?

              1. if tid1, tid2, and tid3 are existed then return tid1
              2. if tid2, and tid3 are existed return tid2
              3. if tid1 and tid2 are NOT existed then return tid3

              One use case:

              1. Display a tiddler using template tid2 (the one tagged with b)
              2. If user supplied its own template use user template here is tid1 (the one tagged with a)
              3. If not supplied tid1 nor tid2 use a default template called tid3

              Solution

              The below solution uses the else (~) operator if the first filter run is empty then the result of second will be returned. The list filter +[limit[1]] limits the output to one tiddler and is required when each filter run results in more than one tiddler.

              <$list variable=template filter="[tag[a]] ~[tag[b]] ~[[tid3]] +[limit[1]]">
              <$transclude mode=block tiddler=<<template>> />
              </$list>

              Other solution

              This is an elementary solution by Mohammad uses OR run and emptyMessage attribute.

              <$list filter="[tag[a]] [tag[b]] +[limit[1]]" emptyMessage="tid3">
              <<currentTiddler>>
              </$list>

              Alternative solution

              This is an alternative solution by TonyM uses OR run.

              <$list filter="[tag[a]] [tag[b]] [[tid3]] +[limit[1]]">
              <<currentTiddler>>
              </$list>

              Select Icon

              Mohammad11th April 2021 at 6:01pm
              solution

              Select Widget with Actions

              Mohammad11th April 2021 at 6:01pm
              exmp111 solution
              Using $select widget how one can trigger an action when a new item is selected?
              The $select widget has an actions attribute which will fire on new selection

              Example

              Write a code to use $select widget and get the text of a selected item and copy it to a demo tiddler.

              Code

              This will set the text field of exmp111/demo/tidPath

              Remarks

              • The $select widget listtiddlers with filter: [prefix[exmp111/data]]
              • In dropdown list one can select among tiddlers
              • On selection the slAction macro triggered
              • The slAction sets the text of exmp111/demo/tidPath to the text of selected item

              See also

              • The exmp067 also shows an advanced usecase of actions string

              select-all-project.jpg

              11th April 2021 at 6:01pm
              images

              select-all.jpg

              11th April 2021 at 6:01pm
              images

              Selection Constructor

              Mohammad11th April 2021 at 6:01pm
              solution
              How to find which filter operator is a selection constructor?
              You can find them by tag or searching title
              • search by tag
                • [tag[Selection Constructors]]
              • search by title field
                • [search[constructor]suffix[Operator]]
              Tiddlywiki

              The output of a Filter Step depends on its operator:

              • Most operators derive their output from their input. For example, many of them output a subset of their input, and thus truly live up to the name of filters, narrowing down the overall output of the containing run. These operators are called selection modifiers.
              • A few operators ignore their input and generate an independent output instead. These are called selection constructors: they construct an entirely new selection.

              A good example of a constructor is . The output of [title[A]title[B]] is just . But the operator is a modifier, so [title[A]field:title[B] outputs nothing at all.

              Selective Coloring of TOC Entries

              Mohammad11th April 2021 at 6:01pm
              solution
              Is it possible to colorify a TOC entry based on the current toc macros?

              By default, the items in a TOC display use the title of each tiddler. However, if you define a caption field for a tiddler, the TOC will use that text instead. This is most often used to bypass the CamelCase name of the tiddler (e..g, "Hello there", instead of "HelloThere") or to provide a longer, more prosaic alternative (e.g, "Greetings and Felicitations!").

              However, the caption text can also contain other wiki syntax, such as the @@ styling syntax, which lets you specify CSS classnames or inline styles. For example, suppose you want a TOC item to be displayed using red text. To do this, you could write the following in the caption field for that tiddler: @@color:red; Text goes here@@

              Alternatively, for more "global" control over the appearance, you could use a CSS classname (e.g., "myTOC"), like this:

              1. First, define a stylesheet tiddler (tagged with $:/tags/Stylesheet), containing
                .myTOC { color:red; } 
              2. Then, in the caption field of the desired TOC item, write:
                @@.myTOC Text goes here@@

              The advantage of the classname method is that you then have centralized control over the styling for all similar TOC items, without having to separately re-edit the caption entries of each item. Thus, if you decide to change the color, or add other CSS attributes, you only have to change the stylesheet tiddler. For example:

              .myTOC { color:green; font-size:150%; border:1px solid; }

              Serach in Filtered List of Tiddlers

              Mohammad11th April 2021 at 6:01pm
              solution

              Search in fields of listed tiddlers

              Set currentTiddler as Default Value for Macro Parameter

              Mohammad11th April 2021 at 6:01pm
              solution
              How to use currentTiddler as default value, when a macro parameter getting a tiddler title is empty?
              Use $set widget and set the emptyValue attribute!

              Example

              The below macro needs a tiddler title as its parameter tiddlername, the $set widget defines a new variable and

              • if the parameter tiddlername has been passed, the selected-tiddler variable assigned to it
              • if the parameter tiddlername has not been passed, then the selected-tiddler variable assigned to currentTiddler.
              \define mymacro(tiddlername)
              <$set name=selected-tiddler value="$tiddlername$" emptyValue=<<currentTiddler>> >
              Action: <<selected-tiddler>>
              </$set>
              \end
              
              <<mymacro>>
              <<mymacro "another tiddler">>

              Setting Empty Value for a Macro Parameter

              Mohammad11th April 2021 at 6:01pm
              solution
              Develop a macro having two parameters like (var1, var2) if var2 is empty set its value to var1
              You need to use a third variable inside macro to take the value of var1 whenever var2 is empty
              \define mymacro(var1, var2:"")
              <$set name=result value="$var2$" emptyValue="$var1$">
              <li>v1: $var1$</li>
              <li>v2: $var2$</li>
              <li>v2(result): <<result>></li>
              </$set>
              \end
              • Example
              <<mymacro test next>>
              <<mymacro test>>
              
              • Result

            • v1: test
            • v2: next
            • v2(result): next
            • v1: test
            • v2:
            • v2(result): test
            • Setting up a TiddlyWiki website on GitHub Pages

              21st April 2021 at 6:50am
              published

              I've been getting some questions about how you can host your ~TiddlyWiki site on ~GitHub.

              Step 1 - setup ~GitHub pages

              To start with you'll need an account on ~GitHub. Then you'll need to setup ~GitHub Pages - this is really easy just follow the instructions at https://pages.github.com/.

              My github account is at https://github.com/joearms and my ~GitHub pages directory is at https://github.com/joearms/joearms.github.io

              Having set this up if I create a file called index.html and store it in https://github.com/joearms/joearms.github.io/blob/master/index.html. Having done this it will magically appear at https://joearms.github.io/index.html.

              All the files under https://github.com/joearms/joearms.github.io can be seen through a web browser pointed at https://joearms.github.io/

              Step 2 - publish your TW

              A ~TiddlyWiki is a single HTML file. So you can either just download An empty TiddlyWiki create your wiki save the file and upload this to your github account.

              Or, use the node.js server version of the ~TiddlyWiki ...

              Making a TW using the node TW server

              In my case I use the node.js version of the ~TiddlyWiki - You have to follow these installation instructions and make a global executable called tiddlywiki.js

              The node server stores all the individual tiddlers as files in the regular file system, this fits nicely in with my other programs.

              One this is done I have a couple of scripts to simplify things start is as follows

              #!/bin/sh
              
              # start TW on port 7123
              
              tiddlywiki.js share --server 7123

              This starts a ~TiddlyWiki server on port 7123 share is the name of a directory where all the tiddlers are stored.

              And publish is:

              #!/bin/sh
              
              # build a single File TW in share/output/index.html
              
              tiddlywiki.js share --build index
              mv share/output/index.html ..

              So to make my blog I run start - and edit the blog in my browser.

              I create a new blog with a title like 2019-02-26 My Title and give this the tag published (this is so the blog will end up in the index).

              Look at Index to see how this is done :-)

              When it's ready I stop the node server and run publish.

              Then I check in the new file index.html and any of the tiddlers that have changed. Then commit and upload to ~GitHub.

              If you poke around under

              https://github.com/joearms/joearms.github.io/tree/master/tw you'll see what was need to create this wiki.

              Shadow Tiddler

              Mohammad11th April 2021 at 6:01pm
              solution

              Shorthand Syntax Summary

              Mohammad11th April 2021 at 6:01pm
              solution syntax
              • The table doesn’t distinguish between using a syntax as an attribute value vs. freestanding — for example, freestanding double curly brace transclusion will wikify the target tiddler, while attribute double curly brace transclusion will just return the raw text
              • The <<__parameter__>> example is a bit misleading because there are two things going on: the automatic conversion of a parameter into a variable name, and the usage of that variable name with the double angle bracket syntax. If a macro transcludes a tiddler than that tiddler would “see” the double underscored parameters just like any other inherited variable

              WikiText provides a range of "shorthands" for widgets. These are less versatile than the widgets but they are typically simpler to use when authoring wikitext.

              Links

              Shorthand links are based on the LinkWidget

              shorthand syntax"lingo"descriptionmore info
              [[title]]"a link (with brackets)"Create link to tiddlerLinking in WikiText
              CamelCase"a camel case link"Create link to tiddlerLinking in WikiText

              Transclusions

              Shorthand transclusions are based on the TranscludeWidget.

              shorthand syntax"lingo"descriptionmore info
              {{title}}"transclude"Transclude tiddler text fieldTransclusion in WikiText
              {{title!!field}}"transclude field"Transclude tiddler fieldTransclusion in WikiText
              {{!!field}}"transclude field"Transclude field in current tiddlerTransclusion in WikiText
              {{...||template}}
              "..." represents either of the transclusions above
              "template transclusion"Transclude text / other field value and display via templateTransclusion in WikiText under ""

              Index transclusions: The above shorthand forms apply equally well to transclude values from index tiddlers. To transclude values from index tiddlers, you use the same shorthand form as above but with ## instead of !!, for example {{title##index}}

              Filtered transclusion

              A filter transclusion works as a kind of "in-line ListWidget". It takes a filter as input, runs it, and from the resulting tiddlers it transcludes the titles.

              shorthand syntax"lingo"descriptionmore info
              {{{filter}}}"filtered transclusion"Transclude the titles from the filter output
              {{{filter||template}}}"filtered transclusion with a template"Transclude the titles from the filter output and display via template

              Macro calls and variable calls

              Macro calls and variable calls are based on the MacroCallWidget

              shorthand syntax"lingo"descriptionmore info
              <<name>>"macro call" or
              "variable call"
              Substitute in contents of macro/variable
              <<macro "parameter">>"macro call with parameter"Substitute in contents of macro using parameter as argument
              <<macro "p1" "" "p3">>"macro call with parameters"Substitute in contents of macro using parameters as argument. Note that second parameter is empty in this example.
              <<__parameter__>>"(call for) parameter as variable"?(only inside macros)
              Evaluate parameter

              Delimiters

              String delimiters to encapsulate strings as arguments. You can use either pair as long as the string itself doesn't contain that/those same delimiter.

              shorthand syntax"lingo"descriptionmore info
              'string'"single quotes"Delimiter (accepts other delimiters except itself)
              "string""double quotes"Delimiter (accepts other delimiters except itself)
              """string""""triple double quotes"Delimiter (accepts other delimiters except itself)

              Notes

              Do not nest shorthand forms

              It is not possible to nest shorthand forms. For example, this does NOT work

              <<mymacro {{myargument}}>>

              Instead you must use the explicit widget for the outer part

              <$macrocall $name=mymacro myparameter={{myargument}} />

              Filters

              Inside filters, the outer brackets are typically omitted. Example

              [tag<tagvariable>] or [tag{!!title}]

              Acknowledgement

              Show a Summary on Tiddler

              Mohammad11th April 2021 at 6:01pm
              exmp062 solution

              Conditional Summary

              Excerpt from Tobias Beer: How to conditionally generate a summary section (or other related information) at the top of all tiddlers tagged xx, so that one doesn't have to click twice, skim the fields until one finds there to be a summary field.

              Step 1

              Create a tiddler tagged $:/tags/ViewTemplate containing:

              <$list filter="[all[current]tag[xx]]">
              <$transclude field="summary" mode="block"/>
              </$list>

              Step 2

              Create a list-after field with the value "$:/core/ui/ViewTemplate/tags" to make the summary segment appear immediately after the tags.

              Example

              The $:/.tb/ui/ViewTemplate/summary serves as a template for a conditional ViewTemplate section that displays the value of the summary field for all tiddlers having a summary field defined, see Example 62: Conditional Summary..

              Show a Table of Content on Each Tiddler

              Mohammad11th April 2021 at 6:01pm
              solution
              How to display a table of contents after the body of those tiddlers that are tagged with say TableOfContents or other root tag?
              Use a viewTemplate with proper toc macro

              Solution i by bimlas

              • Create a new tiddler
              • Tag it with $:/tags/ViewTemplate
              • Put the below script as its text
              <$list filter="[all[current]tag[TableOfContents]]" variable="null">
              
                <h3>Contents</h3>
              
                <div class="tc-table-of-contents">
                  <$macrocall $name="toc-selective-expandable" tag=<<currentTiddler>>/>
                </div>
              
              </$list>
              Remarks
              the first $list widget only filters current tiddler have the root tag, here TableOfContents
              the $macrocall widget calls the toc-selective-expandable macro to display an expandable table of contents with the current tiddler as root tag (means shows the toc tree with current tiddler as the node)

              Solution ii by TonyM

              This is a more elegant solution and one can manually control when and how TOC is displayed on the tiddler using viewTemplates. See this solution here

              • Create a new tiddler
              • Tag it with $:/tags/ViewTemplate
              • Put the below script as its text
              \define default-toc-here()
                 <h4>Optional TOC here</h4>
              <$list filter="[tag<currentTiddler>limit[1]]" emptyMessage="//nothing tagged with <<currentTiddler>>//" variable=nul >
              
                 <$macrocall $name="toc-selective-expandable" tag=<<currentTiddler>> >
              </$list>
              \end
              <$list filter="[all[current]has:field[toc-here]]" variable=nul>
                  <$list filter="[all[current]get[toc-here]]" variable=toc-tiddler emptyMessage=<<default-toc-here>> >
                           <h4>Optional TOC <<toc-tiddler>></h4>
                           <$macrocall $name="toc-selective-expandable" tag=<<toc-tiddler>> >
                  </$list>
              </$list>
              • Nothing will happen right away.
              • Now add the field toc-here to any tiddler and it will provide a toc based on the current tiddler. Use new here to add items to its toc
              • If however you give that field a value of tiddlername eg HelloThere then the tiddlername will be used as the root of the TOC
              • Advantages of this approach
                • No additional tag use
                • Ability to reference other parts of a TOC

              Show All Tags in a Wiki

              Mohammad11th April 2021 at 6:01pm
              solution

              Show Icons of Tiddler

              Mohammad11th April 2021 at 6:01pm
              solution
              <$list filter="[tags[]]"><$link><$transclude tiddler={{!!icon}}/></$link></$list>

              Show Tags with Title in Search Results

              Mohammad11th April 2021 at 6:01pm
              solution
              How do I show tags along with tiddler title in the search result?
              Every tiddler consists of fields. One field is the title field. Another is the tags field. They can be transcluded using this form {{!!fieldname}}.

              The solution is given as

              <div class="tc-menu-list-item">
              <$link to={{!!title}}>
              <$view field="title"/>
              
                 <$list filter={{!!tags}}>
                    <$macrocall $name=tag-pill tag={{!!title}} />
                 </$list>
              </$link>
              </div>

              Remarks

              • The tc-menu-list-item was taken from $:/core/ui/ListItemTemplate
              • The <$link>...</$link> is new in TW 5.1.20 and equal to <$link to={{!!title}}>...</$link>
              • The <$list filter={{!!tags}}> list all tags in the currentTiddler
              • The tag-pill macro is called to show the tags in form of tag-pill one by one

              Example

              Show a list of all tiddlers have in their title the xampl AND 6

              Show Tiddlers Created in the Same Month Day

              Mohammad11th April 2021 at 6:01pm
              exmp086 solution
              How to list all tiddlers created in the same day and month of today?
              This requires to list tiddlers have different creation year but same month and day as today. The split, join and match operator of TW5.1.20 is used to do this

              Example

              which results in:

              Remarks

              • The first $set widget stores the month and day of today date in todayMonthDay
              • The first $list widget lists all tiddlers in the wiki
              • The second $set gets the created dates of each tiddler. The default format is like 20160812195638183 which has 17 digits. The filter splits the 17 digits and selects the last 13 digits and then the first 4 digits, which represents the month-day as 0MM0DD. Then it will be stored in monthDay
              • The last $list compares the two values of monthDay and todayMonthDay and if they match, then a link to tiddler will be displayed.

              Simple Comparison of Two or More Variables

              Mohammad11th April 2021 at 6:01pm
              solution

              See also: Simple Comparison of Two Variables

              The below method has the advantage of being able to test any two + items that generate a "title" in filter notation. Note: <this-wiki> is the result of a wikify widget, not a macro.

              The advantage here is you can put the Same and Different outcomes where ever you want, can have as much or as little wikitext inside each list widget resulting for each option.

              You can see it would be easy to add three or more values that should be the same", all you must do is to follow the -[[2]] with -[[3]] -[[4]] etc...

              Simple Comparison of Two Variables

              Mohammad11th April 2021 at 6:01pm
              solution variable

              How to make a simply comparison between two variables or one variable and a fields content.

              • eg: <<currentWiki>> and {{!!wiki-owner}}
              • or <<currentWiki>> and <<wiki-owner>>

              A simple test or filter that will be true if they are the same and that will be false if they are the same

              Simple Template with List

              Mohammad11th April 2021 at 6:01pm
              solution

              This example shows how template can be used in a list. Assume you several tiddlers tagged with exmp015 and each tiddler has a color field. You can display their text in the color specified in their color field as below:

              Template

              The template used here is:

              Another solution is to use the wikify widget as below in your template

              <$wikify name="colorcode" text="<$view field='color'/><br/>">
              <font color=<<colorcode>>>The quick fox...</font><br/>
              </$wikify>

              Size of Icons in Tiddler Toolbar

              Mohammad11th April 2021 at 6:01pm
              css solution

              To change the size of icon simply put the below code inside a tiddler tagged with $:/tags/Stylesheet

              .tc-tiddler-frame .tc-tiddler-controls {
                  font-size: 2em;
              }

              Slider Macro

              Mohammad11th April 2021 at 6:01pm
              solution

              Slider

              The slider macro uses the reveal widget plus a button to show/hide the content of a tiddler.

              See this Ref http://tw5custom.tiddlyspot.com/ for more information.

              The calling syntax is as below:

              <<slider label tiddler>>

              Where the label and tiddler are the text to be displayed for slider and the title ot tiddler its content to be displayed.

              Example

              See also

              Slider Macro II

              Mohammad11th April 2021 at 6:01pm
              solution

              Slider macro II

              This is another slider macro by Rob Hoelz. Another slider macro introduced by Ton Gerner. See Slider Macro

              Both uses the reveal widget to hide/show contents as a slider. The slider macro II uses tiddler title or caption as slider label and beautiful arrows to show the state of slider (opened or closed)

              Code

              Example

              Example II

              This is a more advanced example shows the use of

              <$list filter="[tag[event]]">
              <$macrocall $name="slider-ii" title=<<currentTiddler>> />
              </$list>

              Results in:

              Slider Macro III

              Mohammad11th April 2021 at 6:01pm
              solution

              A simple slider macro is one accepts a label and a text to be displayed on clicking the label. The below code contains:

              • A macro to accpets label, and text as input parameters
              • A button to change a state tiddler
              • A reveal widget to display the text based on the content of slide tiddler
              \define slider(label,text)
              <$button popup="state/$(currentTiddler)$$label$" class="tc-btn-invisible"><span style="color:#e55;text-decoration: underline">$label$</span></$button>
              <$reveal type="nomatch" text="" default="" state="state/$(currentTiddler)$$label$" animate="yes">
              <blockquote>
              
              $text$
              
              </blockquote>
              </$reveal>
              \end

              Example

              Click on the undelined red words to see the slider in action.

              See also

              solution

              11th April 2021 at 6:01pm
              OthersTiddlers

              Some Mathematical Calculations

              Mohammad11th April 2021 at 6:01pm
              exmp114 solution

              Code

              Sort Tag Wizard

              Mohammad11th April 2021 at 6:01pm
              exmp048 solution
              How to sort tiddlers tagged with specific tag through a dropdown list?
              Use one of sort tagged tiddler macro with a edit-text widget.

              Example

              In Example 48: Sort Tag Wizard a code has been given to do the job. It includes

              • An edit-text widget to let type the desired tag
              • A dropdown to select a tag from list of all tags
              • A macro to sort tiddlers tagged with selected one

              Similar topics

              The below topics are related to sort items. This method is also used in some of the below solution.

              1. Buttons to Sort Tiddlers in Tagpill
              2. Create a Doubly Sorted Table
              3. List by Tag but Sort and Show by Field Value
              4. List Contact Tiddlers Based on a Category
              5. Multiple Sort Rules in TOC
              6. Sort Tiddlers in Tag Pill
              7. Sorting in Table of Contents

              Sort Tiddlers in Tag Pill

              Mohammad11th April 2021 at 6:01pm
              exmp046 solution
              How sort tiddlers in tag-pills?
              One solution is the manual drag and drop and reorder tiddlers inside tag-pill. The below solution shows how to do this automatically.

              When you click on a tag and see a list, and then drag an item in the list, where is that sort-order stored? It's stored in the list field of the tiddler with the same name as the master tag that you clicked on. So, for instance, if you go to TiddlyWiki.com and open the HelloThere tiddler, and look at the "list" field, you will see the tiddlers that reference "HelloThere" listed in the field. They are not in alphabetical order.

              If you copy the following into a tiddler at TiddlyWiki.com, and press the "Sort" button, the corresponding tiddlers will be sorted:

              \define alphasort() <$action-listops $tiddler="HelloThere" $subfilter="+[sort[]]"/>
              
              <$button actions=<<alphasort>>
              Sort "HelloThere"
              </$button>

              You can make changes to this code to sort the list field of any tiddler.

              The catch is, that there is no requirement that all tiddlers that are tagged by a tiddler are listed in its list field. This version will populate the field AND sort it:

              \define alphasort() <$action-listops $tiddler="HelloThere" $filter="[tag[HelloThere]sort[]]"/>
              
              <$button actions=<<alphasort>>>
              Sort "HelloThere"
              </$button>

              A generic macro has been developed to use for sorting tagged tiddlers in the list field. See Example 046: Sort Tiddlers in Tag Pill

              Sorting in Table of Contents

              Mohammad11th April 2021 at 6:01pm
              solution
              Is there any way to sort toc entries based on a field value?
              Table of contents (TOC) is normally sorted based on caption and title field, but it is possible to use other field.

              The second parameter of the toc-selective-expandable macro uses filter syntax to apply a sort order to the set of tiddlers being displayed at each level of the tree.

              sort[toc-order] means "sort the list of tiddlers by the value in the toc-order field of each tiddler.

              Thus, if each tiddler has a toc-order field containing a number then when those tiddlers are shown in the tree, they will be sorted based on those numbers.

              Example

              The below code shows a table of contents with hirbod as the root tag and sorts entries first based on title and then based on page field.

              <div class="tc-table-of-contents">
              
              <<toc-selective-expandable 'hirbod' "sort[title]nsort[page]">>
              
              </div>

              So, if these tiddlers tagged with hirbod, and have page field value as below:

              • Book, page: 0
              • Article, page: 2
              • Chapter, page: -1
              • Section, with no page field

              Will results in:

              • Chapter
              • Book
              • Section
              • Article

              Specification for Autonumbering References

              Mohammad11th April 2021 at 6:01pm
              idea solution

              The basic requirements can be summarized as follows:

              1. anchor: ability of setting in the text the place the original reference, as well as its label and description;
              2. reference: ability of repeatative referencing of the original reference from other places to the tiddler and from other tiddlers;
              3. list: ability to create a list of all primary references;
              4. formatting: ability to display whether the label or the automatic number with a variety of representations (e.g., in round or square brackets, with or without description, etc.), in addition to the description inserted in the text should be wikified, that is, processed by the wiki parser, to be able displaying, in particular, math formulas, other macros, etc.;
              5. popup window: mouse clicking a primary or a repeatative reference launches a popup window containing wikified reference descriptor;
              6. toolbar button: a button in the toolbar of the editor (as well as a shortcut key) to insert a primary and a repeatative reference, selecting the type of object from the list, and for repeatative reference selecting the primary reference via label and description listing.

              Spellcheck Preview in Codemirror

              Mohammad11th April 2021 at 6:01pm
              solution

              How one can activate the spellcheck for codemirror editor?

              A possible solution would be to add a new editor preview pane that contains a plain text editor so that you could switch to it quicklt to perform spell checking and correction.

              Create a new tiddler called $:/_EditorPreview tagged $:/tags/EditPreview, add a caption field containing Spell check, and the following content:

              <$edit-text tiddler=<<currentTiddler>> class="tc-spell-check-preview"/>
              
              <style>
              .tc-spell-check-preview {width:100%;}
              </style>

              Then select "Spell check" as the editor preview.

              In my tests, I needed to click on the preview editor textarea in order to activate spell checking and make the dotted underlines visible.

              Note: This is not work in Tiddlydesktop.

              Split Date into Day Month Year

              Mohammad11th April 2021 at 6:01pm
              exmp037 solution
              Having a date string like "2019-01-28" split it to day, month, and year and return result as Jan 28, 2019
              Use splitbefore and removeprefix and use a data dictionary to map numbers 01 ... 12 to months Jan... Dec.

              Solution

              The solution needs

              1. a macro to get the date string, split the date string into year, month and day
              2. a data dictionary to map numbers 01...12 to months Jan,...Dec.
              \define date-str(date)
              <$list filter="[[$date$]splitbefore[-]]" variable=x >
              <$list filter="[[$date$]removeprefix<x>splitbefore[-]removesuffix[-]]" variable=m>
              
              <$list filter="[[data-months]getindex<m>]" variable="mname">
              
              <$list filter="[[$date$]splitbefore[-]removesuffix[-]]" variable=y >
              <$list filter="[[$date$]removeprefix<x>removeprefix<m>removeprefix[-]]" variable=d >
              <<mname>> <<d>>, <<y>>
              </$list>
              </$list>
              </$list>
              </$list>
              </$list>
              \end

              SQL

              11th April 2021 at 6:01pm
              DataBase

              ssh-keygen

              7th May 2021 at 9:15am
              Git与GitHub

              Stitch Tiddlers together for Printing

              Mohammad11th April 2021 at 6:01pm
              solution
              Can I stitch Tiddlers together for printing?

              Put the following CSS syntax in a tiddler, tagged with $:/tags/Stylesheet:

              @media print {
              .tc-tiddler-frame { page-break-before:always; }
              }

              stock

              11th April 2021 at 6:59pm
              长线投资群摘录

              Story River in Two Columns

              Mohammad11th April 2021 at 6:01pm
              solution

              The below css can split the stroy river in two columns

              .tc-story-river {   display: flex;   flex-wrap: wrap; }
              .tc-tiddler-frame { max-width: 49%; margin-right: 1%; }
              • Use max-height, no wasted space for smaller tiddlers
              • Put that in .tc-tiddler-body, that way the heading part won’t scroll (title,etc,tags)
              .tc-tiddler-body { max-height: 24em; overflow: auto; }

              There is a nice demo with a button to switch single / two columns view. Have a look at:

              Solar flair

              Check and download later.

              Styles and Classes in WikiText

              22nd April 2021 at 6:56am
              WikiText

              You can use this construction to cause the wrapped content to be assigned specified CSS classes or styles:

              Similar syntax is used to assign styles. For example:

              Multiple styles and classes can be mixed. For example:

              Stylesheet for Print Media

              Mohammad11th April 2021 at 6:01pm
              css print solution

              Basically, you just create a tiddler (any title) containing your desired CSS, and tag it with $:/tags/Stylesheet. That's it. The CSS is automatically applied as soon as you finish editing the tiddler.

              To create print-specific CSS rules, use the @media CSS syntax:

              @media print  { ... print-specific CSS rules go here ... }

              Of course, by default, printing will show all rendered elements of the page. To limit the printed output, you need to decide which elements are to be excluded from the output, and then add rules to the print-specific definition to hide those elements. For example, suppose you want to print tiddlers but omit the tags from the output. You could write:

              @media print { .tc-tags-wrapper { display:none; } }

              Note: in most browsers, you can find the class name for a TiddlyWiki element by right-clicking on the element and select "inspect element" from the popup menu. In this particular case (hiding the tags), inspecting a rendered tag on a tiddler takes you to a span with a class name of tc-tag-label. Working up from that element, you will find a containing element called tc-tags-wrapper that surrounds the entire tags display area (not just the specific tag you clicked on). Hiding THAT element hides ALL the tags in ALL tiddlers.

              For hiding specific pieces of tiddler content, define a CSS rule (e.g., ".hideForPrint"), like this:

              @media print { .hideForPrint { display:none; } }

              Then, within your tiddler content, you can use it like this:

              @@.hideForPrint ... screen-only content goes here... @@

              When displayed on-screen, you will see the enclosed content, but when printed, the enclosed content is suppressed.

              Stylesheet Tiddler or Inline CSS

              Mohammad11th April 2021 at 6:01pm
              solution

              Ref: Mark

              See also CSS inside Macro

              To set a new css, what is the best solution?
              1. create a stylesheet tiddler? or
              2. put the css inside a style tag in tiddler (inline css)?
              • Solution

              Use inline CSS

              This is a quick and dirty solution to use custom stylesheet but the problme is the leakage! Whne a tiddler with inline css is open, the css inside it will be available to all opened tiddler and also to the wiki iteself. The below show an example

              title: myTest
              <style>
              .mcls{color: red;}
              </style>
              
              <div class="mcls">This is a text in red.</div>

              Use stylesheet tiddler

              This is the recommended solution. In this way you create a tiddler and tag it with $:\tags\Stylesheet and put your css code inside. This css is available to all tiddler and the whole wiki. Opening the tiddler has no effect. As an example see below code

              title: myCSS
              tag:   $:/tags/Stylesheet
              
              .mcls{color: red;}

              In any other tiddler you can use the css in above tiddler. For example

              title: myTest
              <div class="mcls">This is a text in red.</div>

              Stylesheet with Conditional Rules

              Mohammad11th April 2021 at 6:01pm
              exmp018 solution

              We can use wikitext primitives within stylesheets to make conditional rules.

              Tiny bit of background about stylesheets: TiddlyWiki in the browser renders all tiddlers tagged $:/tags/Stylesheet into a <style> element. Tiddlers of content type text/css will be processed as raw CSS, but tiddlers with the content type text/vnd.tiddlywiki (the default) are processed by first wikifying them, and then extracting the plain text portion. (So, for example, if a text/vnd.tiddlywiki stylesheet were to contain the text <p>23</p>, the plain text content would be the string “23”).

              There's a danger of inadvertent wikification of stylesheet text, and so we usually use a \rules pragma to restrict the wikitext rules that will be observed within the stylesheet to just transclusion and macro invocations:

              \rules only filteredtranscludeinline transcludeinline macrocallinline macrocallblock

              Putting the pieces together, here’s a stylesheet that sets the page background colour to green whenever the sidebar is hidden:

              Open example 18 and add $:/tags/Stylesheet tag to see it is in action.

              \define if-sidebar-visible(text)
              <$reveal state="$:/state/sidebar" type="nomatch" text="yes" default="yes">
              $text$
              </$reveal>
              \end
              
              \define if-sidebar-not-visible(text)
              <$reveal state="$:/state/sidebar" type="nomatch" text="no" default="yes">
              $text$
              </$reveal>
              \end
              
              \rules only filteredtranscludeinline transcludeinline macrocallinline macrocallblock
              
              html body.tc-body {
              	background: <<if-sidebar-visible "green">><<if-sidebar-not-visible "blue">>;
              }

              Subfilter Example

              Mohammad11th April 2021 at 6:01pm
              exmp020 solution
              How and where subfilter is used?

              Imagine you want to dynamically create filters. You can obviously use macro definitions and use them like

              filter=<<mymacro>>

              Issue arises when you want to add steps to the filter. You cannot go

              filter="<<mymacro>> +[tag[mytag]]"

              Subfilter solves this issue. You can go like

              filter="[subfilter<mymacro>] +[tag[mytag]]"

              And in another tiddler you can go like

              filter="[subfilter<mymacro>append[!]]"

              Basically it enables you to define dynamic filters and reuse them.

              See Example 20

              Summarizing Data Tiddler

              Mohammad11th April 2021 at 6:01pm
              exmp109 solution
              How to summarize the numerical values of several dataTiddlers like number of indexes, sum of their values, average of their values, ... in form of a table?
              Use $list widget to count, take sum and average employing the new mathematics operators in Tiddlywiki 5.1.21+

              Example

              Assume set of data tiddler all tagged with exmp109 have different indexes like ia, ib, ic, etc. Write a script to create a table each row built from a dataTiddler and each column one of the computed value, like count, sum, and average.

              Results

              Remarks

              Summing Values in Fields

              Mohammad11th April 2021 at 6:01pm
              exmp118 solution
              Is it possible to sum the values held in Field A wherever the field exists?
              Yes, use proper fields

              Example

              Sum the values of field fa in all tiddlers tagged with exmp118

              Using filters, you can write:

              Remarks
              • The get[fa] operator retrieves a list of all values from all tiddlers that have a non empty field fa.
              • Then, the sum[] operator adds up all the retrieved values.

              SVG ICONS as BUTTONS

              Mohammad11th April 2021 at 6:01pm
              solution

              The below instruction shows how to use css effectively for styling embeded svg tiddlers as buttons.

              Change the fill color of svg buttons

              The image-buttons (svg) on the top right of TW5 have a hover effect, having your custom svg button how it is possible to have the same behavior?
              The CSS selectors that control these buttons look like this (with different colour definitions)
              .tc-page-controls button.tc-selected svg {
                 fill: rgb(99, 99, 99);
              }
              
              .tc-page-controls svg {
                 fill: rgb(150, 150, 150);
              }
              
              .tc-page-controls button:hover svg,
              .tc-page-controls a:hover svg {
                 fill: rgb(99, 99, 99);
              }
              
              So make sure you use svg images and that you can control their fill colour via CSS (no fill colors inside the graphics).

              The content type of svg tiddlers

              Why the svg tiddlers having the content type (image/svg+xml) does not take affect from css selectors?
              The reason is explained in Tiddlywiki.com. Tiddlers with the type image/svg+xml are interpreted as SVG images, and displayed and transcluded as self-contained <img> elements with the SVG embedded as a data URI in the src attribute.

              Example

              See SVG Example 2 for further details. Also SVG Example 3 for applying css classes to svg transcluded as inline image (button).

              References

              1. Using svg explains what happens, if the content type of an svg tiddler is set.
              2. Vanilla theme explains, the class tc-image-button to be used only for sizes, not for fill-definitions.

              SVG Images Transclusion

              Mohammad11th April 2021 at 6:01pm
              solution

              There is some documentation about the difference between SVG images and tiddlers containing SVG elements here:

              https://tiddlywiki.com/#Using%20SVG

              The advantage of using raw SVG elements is that they can be styled via CSS, unlike SVG images within an img element.

              Switch Case Construct

              Mohammad11th April 2021 at 6:01pm
              exmp068 solution
              The switch-case or select-case is a programming construct allows a variable to be tested for equality against a list of values. How this construct can be implemented using TW scripts?
              There are several solution, here list widget is used to implement switch case construct.

              Switch case construct

              In programming languages like C the switch case construct is as below. The expression is compared against different case values and if matched, the code block of that case-value will be executed. The default case will be executed if expression result does not match any any case-values.

              switch( expression )
              {
              	case value-1:
              			Block-1;
              			Break;
              	case value-2:
              			Block-2;
              			Break;
              	case value-n:
              			Block-n;
              			Break;
              	default:
              			Block-1;
              			Break;
              }

              Simple method

              The simple method only tests if an item is included in a list. Here the switch macro recives two parameter, item and list. If item found in the list it will displayed if not a message equivalent to default case will be shown.

              Here the list is equivalent to case-values in other programming language.

              \define switch(item, list:"a b c")
              <$list filter="[enlist<__list__>search<__item__>]" emptyMessage="""No $item$ in: $list$""">
              You passed <<currentTiddler>>
              </$list>
              \end
              
              <<switch a>>
              
              <<switch b>>

              Advanced method

              This method uses actions macros to perform operation on any matched cases. For simplicity here, the macro names are equal to items in the list, but it possible to use other names for actions macros. If item matches any value in the list the suitable action macro called, if not the default macro will by run. Actions macro can perform any complex operation.

              \define a() This is the action for a.
              \define b() This is action for b.
              \define c() This is action for c.
              \define default() This is default action.
              
              \define switch(item, list:"a b c")
              <$list filter="[enlist<__list__>search<__item__>]" emptyMessage=<<default>> variable="actMacro">
              <$macrocall $name=<<actMacro>> />
              </$list>
              \end
              
              
              <<switch a>>
              
              <<switch b>>
              
              <<switch d>>

              Demo

              Example 68: Switch Case Construct demonstrates how above codes work.

              Switch Field Values and Select Widget

              Mohammad11th April 2021 at 6:01pm
              exmp067 solution
              How to switch a field value among predefined values and keep the old one for further processing?
              Use set and select widgets with together and store the old value in a variable using the set widget

              As described by Jeremy when select widget is used, any variables setup outside of the action string will not be updated to reflect the new value of the target tiddler.

              Example

              Assume a tiddler like exmp067/data has a field fa, its value is set among predefined items provided by a select widget. The code has to let to change the value of fa and keep its previous value for further processing. In breif the code shall do the below operations

              • Temp = fa
              • fa = new value

              This is a demo is given in exmp067/data

              • Field fa:
              • Field fb:

              Code

              The code is given in exmp067/data has tow parts as below

              • action macro
              • set/select widget

              Remarks

              • The outer set widget first stores the value of field fa from tiddler exmp067/data into a variable, Temp
              • The select widget lets user choose a new value from a list of predefined values
              • The select widget then calls the action macro switch to perform the below operation
                • set the value of fa field by what is selected within select widget
                • set the previous value of fa into fb field (this is only for demo purpose, any other operation can be done on the previous value)

              Switch Tags without Change in Timestamp

              Mohammad11th April 2021 at 6:01pm
              exmp025 solution

              A short script here is developed to switch tags (add new tag and remove old one) without change in the tiddler timestamp.

              To do so, the content of $:/config/TimestampDisable is read and then it is set to yes. The tags are switched and the content of $:/config/TimestampDisable of restored to its initial value.

              \define BtnTagListops(btntext,add-remove,tooltip)
              <$button tooltip="""$tooltip$""">
              <$wikify name="timestampState" text="{{$:/config/TimestampDisable}}">
              <$action-setfield $tiddler="$:/config/TimestampDisable" $value="yes"/>
              <$action-listops $tags="$add-remove$" />
              $btntext$
              <$action-setfield $tiddler="$:/config/TimestampDisable" $value=<<timestampState>>/>
              </$wikify>
              </$button>
              \end
              • The BtnTagListops has three parameters
                1. btntext the text or caption of button
                2. add-remove the tag to be added or removed (with - sign)
                3. tooltip a tooltip text for button to be displayed on mouse hover

              This does change tags WITHOUT updating timestamps (it stores and restores the previous setting for updating timestamps).

              The BtnTagListops can be called from other macro. For example the todoBtnDoNow macro below adds the tag ToDoNow and removes the tag with the minus (-) ToDo. You could add and remove as many tags as you like.

              \define todoBtnDoNow()
              <$wikify name="tt" text="switch tags">
                 <$macrocall $name="BtnTagListops" btntext="Do this now" add-remove="ToDoNow -ToDo" tooltip=<<tt>>/>
              </$wikify>
              \end

              See Example 25

              Switch Two Fields Value

              Mohammad11th April 2021 at 6:01pm
              exmp066 solution
              How to exchange the values of two fields?
              Use the set widget plug and action widget like button and perform it as below
              • temp = fa
              • fa = fb
              • fb = temp

              Example

              Assume a tiddler has two fields fa, and fb, the below code perform the job

              \define switch()
              <$action-setfield $tiddler="exmp066/temp" $value={{exmp066/data!!fa}} />
              <$action-setfield $tiddler="exmp066/data" $field="fa" $value={{exmp066/data!!fb}} />
              <$action-setfield $tiddler="exmp066/data" $field="fb" $value={{exmp066/temp}} />
              \end
              
              <$button actions=<<switch>> >Exchange fields value
              </$button>

              Remarks

              • The button lets do the actions, other action widgets also can be used
              • The switch macro implements the operation as below
                • first the value of field fa is stored in temporary tiddler exmp066/temp
                • second, the value of field fa is set by the value of field fb
                • third the value of field fb is set the stored value of fa in temp tiddler
              • the exmp066/data is the tiddler used fro demonstration and holds the two fields

              Syntax for Using Brackets

              Mohammad11th April 2021 at 6:01pm
              solution syntax

              The thing to remember is that the brackets go with the TYPE of operand....

              • use square brackets for literal values: tag[foo]
              • use curly brackets for tiddler field references: tag{foo}
              • use angle brackets for variable references: tag<foo>

              The thing to remember is that the brackets go with the TYPE of operand....

              • [foo] is a literal value
              • <foo> is a variable reference
              • {!!foo} is a reference to field "foo" in the current tiddler
              • {SomeTiddler} is a reference to the text field contents of a tiddler named "~SomeTiddler"
              • {SomeTiddler!!foo} is a reference to the value of the "foo" field in tiddler "~SomeTiddler"

              System Field and User Field

              Mohammad11th April 2021 at 6:01pm
              solution

              Table Class by Variable

              Mohammad11th April 2021 at 6:01pm
              solution table
              How set the table class by variable?

              It is possible to set the table class by variable. To do this define the whole table inside a macro.

              Example

              The below example sets two different classes to a table defined inside a macro. This example contains three parts

              1. A macro defines a table
              2. A set of css to define the table classes
              3. A small script to set the variable class and call the macro

              The table macro

              mytable simply defines a table containing four rows, two columns, with table header, footer and caption. The table class is set by <table class="$(myclasses)$">.

              \define mytable() 
              <table class="$(myclasses)$">
              <caption>This is the table caption</caption>
              <thead><tr><td>Header-L</td><td>Header-R</td></tr></thead>
              <tbody>
              <tr><td>Cell 1</td><td>Cell 2</td></tr>
              <tr><td>Cell 3</td><td>Cell 4</td></tr>
              <tr><td>Cell 5</td><td>Cell 6</td></tr>
              <tr><td>Cell 7</td><td>Cell 8</td></tr>
              </tbody>
              <tfoot><tr><td>Footer-L</td><td>Footer-R</td></tr></tfoot>
              \end

              Table classes

              For the sake of simplicity two classes myclass and anotherClass are defined an inline tiddler as below.

              Then the vars widget is used to define the variable classes and inside the vars widget the mytable macro is called.

              Table Tool

              Mohammad11th April 2021 at 6:01pm
              solution table

              TableTool helps to create a table based on a collection of JSON tiddlers (the row tiddlers), where each tiddler represents a row and the values of the columns are stored as json keys.

              Wiki page: https://mauloop.github.io/tw5-table-tool/

              Table-of-Contents Macros

              21st April 2021 at 6:49pm
              FromTiddlerWiki

              ~TiddlyWiki provides several macros for generating a tree of tiddler links by analysing tags:

              A simple tree
              A tree in which all the branches can be expanded and collapsed
              A tree in which the non-empty branches can be expanded and collapsed
              and
              A two-panel browser:
              • on the left, a selectively expandable tree that behaves like a set of vertical tabs
              • on the right, the content of whichever tiddler the user selects in the tree

              The difference between the last two has to do with what happens when the user clicks a link in the right-hand panel:

              The target tiddler appears in the right-hand panel, replacing the tiddler that contained the link
              The target tiddler appears in the normal way (which depends on the user's configured storyview)

              Structure

              The top level of the tree consists of the tiddlers that carry a particular tag, known as the . Tiddlers tagged with any of those make up the next level down, and so on.

              At each level, the tiddlers can be ordered by means of the field of the parent tag tiddler. They can also be ordered by the macro's parameter.

              The tree displays the field of a tiddler if it has one, or the tiddler's title otherwise.

              Each tiddler in the tree is normally displayed as a link. To suppress this, give the tiddler a field with the the value . In the examples, the SecondThree tiddler is set up like this. Clicking such a tiddler in the tree causes its branch to expand or collapse.

              By default, the links open the tiddlers making up the table of contents. Alternatively, if the tiddler contains a field then its contents will be used as the target of the link.

              The table of contents is generated as an HTML ordered list. The <ol> elements always have the class tc-toc. Expandable trees have the additional class tc-toc-expandable. Selectively expandable trees (including those in the two-panel browser) have tc-toc-selective-expandable.

              To make a table of contents appear in the sidebar, see How to add a new tab to the sidebar.

              Parameters

              tag
              The root tag that identifies the top level of the tree
              sort
              An optional extra filter step, e.g. sort[title]

              These two parameters are combined into a single filter expression like this:

              [tag[$tag$]$sort$]

              and take additional parameters:

              selectedTiddler
              The title of the state tiddler for noting the currently selected tiddler, defaulting to $:/temp/toc/selectedTiddler. It is recommended that this be a system tiddler
              unselectedText
              The text to display when no tiddler is selected in the tree
              missingText
              The text to display if the selected tiddler doesn't exist
              template
              Optionally, the title of a tiddler to use as a template for transcluding the selected tiddler into the right-hand panel

              Examples

              Tables in WikiText

              22nd April 2021 at 6:56am
              WikiText

              Basics

              TiddlyWiki5 formats tables using vertical bar characters like so:

              |!Cell1 |!Cell2 |
              |Cell3 |Cell3 |

              Exclamation marks are used to indicate header cells. The example renders as:

              Cell1Cell2
              Cell3Cell3

              Cell Alignment

              Table cell alignment is controlled by inserting space characters before and/or after the cell content. For example:

              |Left aligned content |
              | Right aligned content|
              | Centred content |
              |+++ a very wide column so we can see the alignment +++|

              The example renders as:

              Left aligned content
              Right aligned content
              Centred content
              +++ a very wide column so we can see the alignment +++

              Cell vertical Alignment

              Vertical alignment of cells is done by inserting either a ^ for top alignment or a , for bottom alignment as the first character of a cell. The normal horizontal alignment is still possible. For example:

              |^top left |^ top center |^ top right|
              |middle left | middle center | middle right|
              |,bottom left |, bottom center |, bottom right|

              The example renders as:

              :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
              ::
              ::
              top lefttop centertop right::
              ::
              ::
              ::
              middle leftmiddle centermiddle right::
              ::
              ::
              ::
              bottom leftbottom centerbottom right::
              ::
              :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

              If you need to have a ^or a , as the first character of a left aligned cell, you can use HTML escaping:

              ^&#94;
              ,&#44;

              Cell Merging

              To merge a table cell with the one above, use the special cell text ~. To merge a cell with the one to its left use the text <. To merge one to its right use >. For example:

              |Cell1 |Cell2 |Cell3 |Cell4 |
              |Cell5 |Cell6 |Cell7 |<|
              |Cell5 |~|Cell7 |Cell8 |
              |>|Cell9 |Cell10 |Cell11 |

              Renders as:

              Cell1Cell2Cell3Cell4
              Cell5Cell6Cell7
              Cell5Cell7Cell8
              Cell9Cell10Cell11

              Table Classes, Captions, Headers and Footers

              Table CSS classes, captions, headers and footers can be specified as special pseudo-rows. The following example:

              • assigns the CSS classes "myclass" and "anotherClass" to the table
              • gives the table the caption "This is a caption"
              • adds a header row of cells with the text "Header"
              • adds a footer row of cells with the text "Footer"
              |myclass anotherClass|k
              |This is a caption |c
              |Cell1 |Cell2 |
              |Cell3 |Cell3 |
              |Header|Header|h
              |Footer|Footer|f

              Renders as:

              This is a caption
              Cell1Cell2
              Cell3Cell3
              HeaderHeader
              FooterFooter

              Tabs Macro and Tiddlers Transcluding Fields

              Mohammad11th April 2021 at 6:01pm
              exmp060 solution

              Problem with displaying tiddlers in tabs when they contains transcluded fileds

              I have a tiddler that transclude its caption filed using {{!!caption}} in the text (body). It correctly pulls the caption field value and everything works as it should. However, when I call the tabs macro in a new tiddler and have it display the original tiddler as a tab, the {{!!caption}} reference breaks and appears to reference the tiddler calling the tabs macro.

              • Solution

              As described in https://tiddlywiki.com/#tabs%20Macro when tiddlers are used in tabs macro, if they contains transclusion of fields or reference to currentTiddler variable, these refences wil not work anymore. The solution is to use a template in tabs macro as below

              <$tiddler tiddler=<<currentTab>>>
              <$transclude mode="block" />
              </$tiddler>

              So the tabs macro should be used like the below

              <<tabs "[tag[exmp060]]" template="template/exmp060">>

              Example

              The tiddler Example 60 shows how tabs macro work with template tiddler to correctly displayed the fields and currentTiddler value.

              Tabs Macro Button Template

              Mohammad11th April 2021 at 6:01pm
              exmp115 solution
              How to add a button to every tab created by tabs macro, on click open the tiddler for edit?
              Use a suitable buttonTemplate with tabs macro

              Solution

              The tabs macro accepts a parameter called buttonTemplate, it is, the title of a tiddler to use as a template for transcluding the content of the button for the selected tab. For more information see tabs macro.

              The below template addes a button to tabs

              • the template uses $view widget to show the caption, id not present the title of current tab
              • the $button widget uses tm-edit-tiddler to open the current tab in edit mode

              Example

              Remarks
              a small butoon with caption E is appeared on every tab
              on click the tiddler corresponding to selected tab is opened in edit mode

              Tag Cloud

              Mohammad11th April 2021 at 6:01pm
              exmp083 solution
              How to generate a list of tags with the number of tiddlers tag them in increasing order?
              This is used for creating tag cloud (tag crowd)

              Solution

              1. Using the new filter operator count in TW 5.1.20, one can count the number of tiddlers tagged with specific tag (the tagcount macro)
              2. The result can be stored in a variable using the $wikify widget (the counts variable)
              3. The first $list widget sort the counts (numbers of tiddlers for each tag)
              4. The second $list widget sort the list of tags
              5. The third $list widget searchs in number of tiddlers in each tag and if it finds this number equal to the one from first list, then it will display <<counts2>> -- <<tag>>

              Code

              Example

              Tag Hierachy and Table of Contents

              Mohammad11th April 2021 at 6:01pm
              solution
              How display the tag tree for three levels of tag hierachy?
              The below code uses three nested list widget to show the tag tree up to level 3. This procedure can be used to create table of contents. A customized numbered list is used (ref: Tobias Beer)

              TagFilter

              11th April 2021 at 6:01pm
              MyOwn
              • TiddlyWiki transclusion show using double curly brace 。

              Tagging

              11th April 2021 at 6:01pm
              MyOwn

              Tagging is a way of organising tiddlers into categories. For example, if you had tiddlers representing various individuals, you could tag them as friend, family, colleague etc to indicate these people's relationships to you.

              A tag is in fact just a tiddler (or a potential tiddler), and it can have tags of its own. You can add any number of tags to the same tiddler.

              See Creating and editing tiddlers for instructions on how to tag.

              By tagging your tiddlers, you can view, navigate and organise your information in numerous additional ways:

              • The coloured tag pills on a tiddler give you quick access to all the other tiddlers with the same tag, as well as to the tiddler that represents the tag itself.
              • If a tiddler is serving as a tag, then the Tagging tab in its InfoPanel will show you which tiddlers are currently tagged with it.
              • The More tab of the sidebar has a Tags tab that presents an overview of all your tags and lets you access all your tagged tiddlers.
              • You can use filters to create lists of tiddlers based on their tags. You can then display any combination of the fields of those tiddlers. For example, you could build a glossary by listing the title and text of all tiddlers tagged Glossary. Such lists can be formatted in any way you wish: e.g. bulleted, numbered or comma-separated.
              • There are a number of special system tags that control the layout of tiddlers and the entire ~TiddlyWiki page. See Page and tiddler layout customisation for instructions.

              There are two more things you can do with tags:

              Set a tag's colour and icon

              You can use the tag manager, found on the Tags tab under More in the sidebar, to change the colour of a tag's pill or add an icon to the pill.

              • To change the colour, click the button in the Colour column to select from a colour picker. Alternatively, click the icon in the Info column, then type a CSS colour value in the Colour field
              • To change the icon, click the button in the Icon column and choose from the list of available icons

              Change the order in which tags are listed

              By default, tagged tiddlers are listed in alphabetical order.

              If you want any other order, add a field to the tag tiddler, and set its value to be a list of the tiddlers in that order.

              The list field doesn't have to mention all of the tiddlers. See the precise rules ~TiddlyWiki uses to order tagged tiddlers.

              TCP&IP

              21st April 2021 at 9:58pm
              Web

              Template and Tiddler Widget

              Mohammad11th April 2021 at 6:01pm
              solution tiddler

              This is a good example shows several features

              1. Using $tiddler widget
              2. Using addprefix and addsufix to produce some conetnt for a newly created tiddler
              3. Using template tiddler in set widget
              <$tiddler tiddler="$:/state/NewTiddlerForm">
              
              !Title
              
              <$edit-text class='tc-edit-texteditor' field='name_temp' placeholder='Life the Universe and Everything' /><br>
              
              !!Value of Constant
              
              <$edit-text class='tc-edit-texteditor' field='value'/>
              
              <$button>
              Create Tiddler
              <$set name="valuetext" value={{{ [{!!value}addprefix[<$latex text="""]addsuffix["""></$latex>]] }}}>
              <$action-setfield $tiddler={{!!name_temp}} text=<<valuetext>> value={{!!value}}/>
              </$set>
              <$action-navigate $to={{!!name_temp}}/>
              </$button>
              
              </$tiddler>
              • If you are referring to the same tiddler many times, it is often helpful to use the <$tiddler> widget to set the currentTiddler, and then be able to take advantage of defaults and omit the tiddler title from widgets like the edit widget
              • We use a filtered transclusion with the set widget to create the text value for the new tiddler by taking the value entered by the user and adding a prefix and suffix

              Template for Displaying Fields in View Mode

              Mohammad17th April 2021 at 10:31pm
              done solution task

              Template to Show Tagged Tiddlers as a Footer

              Mohammad11th April 2021 at 6:01pm
              solution viewtemplate

              To show a list of all tiddlers tagged say with Content as footer in all those tiddlers, use a template as below

              Template tiddler
              title: list-tagged-tiddlers
              tag: $:/tags/ViewTemplate
              text:
              <$list filter="[all[current]tag[Content]]">
               | <$list filter="[tag[Content]!has[draft.of]]"><$link to={{!!title}}><$view field="caption"><$view field="title"></$view></$view></$link> | </$list>
              </$list>

              Now every tiddler has been tagged with Content will show in its footer a nice list of all tiddlers, they have Conetnt tag.

              If tiddlers have caption, their caption will show instead of title.

              More

              See the viewtemplate/tagging in this wiki how displays all tiddlers tagged with the parent.

              Test Filters

              Mohammad11th April 2021 at 6:01pm
              solution
              How to display all advanced search filter in a table and a test button to open the advanced search tiddler?
              The advanced search filters are stored in tiddlers tagged with $:/tags/Filter. Use a $list widget to create a table and test button.

              Solution

              The below $list creates rows of table with three columns from all tiddlers tagged with $:/tags/Filter. These tiddlers have two fields

              • description: short description of filter
              • filter: the filter expression

              A local macro (test-filter)is used to create a button set the value of advanced search filter and navigate to $:/core/ui/AdvancedSearch/Filter.

              Macro

              Table

              Text Formatting with Macro

              Mohammad11th April 2021 at 6:01pm
              exmp007 solution





              Dear ,

              ! INCOME TAX ASSESSMENT 2018

              We attach your income tax assessment for the , which has been checked and agreed with your return as lodged.

              The tax office shows a refund of $ for you which should have been forwarded to your nominated bank account.

              Please contact us if you have any queries.



              Other tiddlers in exmp017

                The Default Input to Filters

                Mohammad11th April 2021 at 6:01pm
                solution
                What is the default input of a filter run? What will return the below script?
                create a new tiddler in tiddlywiki.com
                enter the <$list filter="[add[0]]"/> into the body and save
                • What is happening is that, by default, a filter starts with an implied all[tiddlers].
                • Non-numeric list items (such as tiddler titles) have a value of 0.
                • At tiddlyWiki.com, there are 1304 non-shadow tiddlers.

                Thus, each of the above filters is producing 1304 numeric results.

                Remarks
                all filters starts with implied all[tiddlers]
                the first step to limit the size of the set of titles to be used by the filter is using all[current], !is[system], etc...

                The has Operator Behaviour

                Mohammad11th April 2021 at 6:01pm
                operator solution
                What are the differences between these two filters:
                1. [has[fieldname]] and
                2. [has:field[fieldname]]

                Assume you have used above filters inside a $list widget as below:

                Case I:
                <$list filter="[has[fieldname]]" variable="v">
                <<v>>
                </$list>

                and

                Case I:
                <$list filter="[has:field[fieldname]]" variable="v">
                <<v>>
                </$list>

                The differences are as below:

                • Both cases returns nothing (empty v) if the field does not exist.
                • Both cases return the same result is the field exist and is NOT EMPTY.
                • Case I returns nothing (empty v) if the field EXIST but is EMPTY.
                • Case II returns the tiddler title if the field EXIST but is EMPTY.
                TonyM

                Remark

                In has operator on Tiddlywiki, it has been explained that:

                • has operator can be used with a suffix
                • the value suffix is equivalent to no suffix
                  • [has[myfield]] or [has:value[myfield] are the same
                  • result is: those input tiddlers in which field has a non-empty value
                • the field suffix
                  • result: those input tiddlers in which field exists

                The is Blank Operator

                Mohammad11th April 2021 at 6:01pm
                exmp119 solution task

                the index is NOT blank

                Mark isblank operates on the output of the new split operator, which might be "mytitle" "" "someothertitle" "" etc.

                So there has to be a "" to determine if it is blank.

                Most filter operators do not produce "". If something is "", it puts out NO output – not even ""

                The operator getindex[xx] produces NO output, and so there is nothing to evaluate. You get the same result whether you don't use is[blank] .

                So the upshot is, that is[blank] is mostly useful in the context of the split and splitreg operators.

                Jeremy

                I assumed the below dataTiddler returns zero length string, but now I understood it idoes not! The value of xx is missing!

                Indeed, the getindex operator and the get operator both work that way, the great thing is that it lets you use the else[] operator to provide a fallback value:

                [getindex[xx]else[defaultvalue]match[targetvalue]]

                The List Field

                Mohammad11th April 2021 at 6:01pm
                list solution

                Tiddler list field

                The list field has special handling that allows for automatic substitution when a title is changed. This is possible because the list field is always treated as a space-separated list of tiddler titles. Thus, it can be parsed for individual title matches to recognize when a title has been changed and replace only that title text within the field value.

                The problem with doing this for other fields is that they can contain spaces that are just normal text not intended to be treated as separators between titles.

                Consider two fields where

                list = "foo bar baz" (a list of three tiddler titles)

                and

                otherfield = "this ice cream bar is tasty" (some normal text)

                If you change the title of the tiddler named "bar" to "mumble", then the value of list is updated to "foo mumble baz"

                However, the value of "otherfield" should remain unchanged even though it contains "bar", because that is just normal text.

                Currently, ALL field content except for the list field are treated as normal text (see note below).

                Note: Standard tiddler date fields (created and modified) are stored as normal text using format YYYY0MM0DD0hh0mm0ss0XXX (e.g. "20150117190213631" for January 17, 2015 at 19:02:13.631). These fields can be formatted for date/time display using the <$view ... format="date"...> widget.

                The Logic by Set Widget

                Mohammad11th April 2021 at 6:01pm
                exmp058 solution

                The logic used by the $set widget to determine the result assigned to the variable is as follows:

                1. If the "tiddler" attribute is present and not blank, then:
                  1. If the "subtiddler" attribute is also present and not blank, then get the subtiddler from the specified tiddler, otherwise just get the tiddler itself
                  2. If the "field" attribute is present then return return the value of that field, or the value of the "emptyValue" attribute if the field is blank or missing
                  3. Otherwise, if the "index" attribute is present, return the value of the specified index, or the value of the "emptyValue" attribute if the index is blank or missing
                  4. Otherwise, return the text field of the tiddler, or the value of the "emptyValue" attribute if the text field is blank or missing
                2. If the "filter" attribute is present and not blank, then evaluate the results of the filter, and:
                  1. If the "value" attribute is present and the filter results are not empty, return the value of the "value" attribute (even if the "value" attribute is blank)
                  2. If the "value" attribute is present and the filter results are empty, return the value of the "emptyValue" attribute, if present, otherwise return a blank result
                  3. If the "value" attribute is not present, then if the "select" attribute is a valid number it is used to retrieve a specified result from the filter
                  4. If the "value" attribute is not present, and the "select" attribute is not a valid number, and the filter results are not empty, then the entire filter results are returned (using double square brackets quoting around any results that include spaces)
                  5. If the "value" attribute is not present, the "select" attribute is not a valid number, and the filter results are empty, then the value of the "emptyValue" attribute is returned (or blank if it is not present)
                3. If neither the "tiddler" or "filter" attributes are provided, return the value of the "value" attribute, or the value of the "emptyValue" attribute if the "value" attribute is blank or missing

                See Example 58: Logic of Set Widget for deyails and demos.

                The RAM Usage of Tiddlywiki on Node.js

                Mohammad11th April 2021 at 6:01pm
                solution
                Why Tiddlywiki on Node.js uses higher RAM?

                TiddlyWiki under Node.js loads the entire wiki into RAM. It does so in order to support server-side processing (such as serverside page rendering). But, of course, it is relatively resource intensive, and unnecessary if all the server is doing is acting as a front end to a database of tiddlers, and the browser is doing all the rendering.

                Arlen Beiler recently did some exploration along these lines recently. See Forum

                Thinker

                21st April 2021 at 9:49pm
                MyContents

                Tiddler Associated with a Button

                Mohammad11th April 2021 at 6:01pm
                solution state

                Interactivity in TiddlyWiki is based on a couple of priniciples:

                • The entire state of the user interface is modelled as the values of tiddlers in the store
                • User interface events such as button clicks make changes to the tiddler store which then trigger a refresh of the display to match the new state of the store

                You can explore this happening by opening up the advanced search tiddler, switching to the "Filter" tab, and then selecting "Recently modified tiddlers, including system tiddlers" from the dropdown. Keep an eye on the results as you switch between sidebar tabs and you'll see that the tiddler $:/state/tab/sidebar--595412856 contains the title of the currently selected tab. It's a two way binding: if you manually edit that tiddler then you'll see the current tab change in reaction.

                All UI in TW is constructed in this same way. For example, dropdowns are modelled as a state tiddler that keeps track of whether the dropdown is open or not. The reveal widget is used with the state tiddler to show or hide the dropdown as required.

                A critical challenge when designing UIs in TiddlyWiki is choosing between the options for titling these state tiddlers. Most of the core uses a scheme we call "qualified titles" to generate a title that depends upon the position in the render tree.

                Tiddler Count to Dictate HTML Table Rowspan

                Mohammad11th April 2021 at 6:01pm
                solution
                <$wikify name="count" text="<$count filter='[tag[Contents]]'/>">
                <table>
                <tr>
                <td colspan=<<count>>>
                <$count tiddler="Contents" filter=[tag[Contents]]/> columns </td>
                </tr>
                <tr><td> 1 </td><td> 1 </td><td> 1 </td><td> 1 </td></tr>
                </table>
                </$wikify>

                Tiddler Toolbar Icon

                Mohammad11th April 2021 at 6:01pm
                solution

                How the size and other properties of tiddler toolbar icons can be changed?

                Use css as below to style them! These css hsall be put inside a tidddler tagged with $:/tags/Stylesheet.

                .tc-tiddler-frame .tc-tiddler-controls {}
                • Example

                Change the size of tiddler toolbar icons to 1.75rem

                .tc-tiddler-frame .tc-tiddler-controls { font-size: 1.75rem; }

                Tiddler Width and Viewport Size

                Mohammad11th April 2021 at 6:01pm
                solution
                Is there any way to return the size or width of tiddler and viewport using Tiddlywiki script?
                The viewport sizes can be accessed using CSS (e.g vh, and vw) for the tiddler width it depends to the layout. See the below code
                <$list filter="[{$:/themes/tiddlywiki/vanilla/options/sidebarlayout}prefix[fluid-fixed]]">
                  calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 160px)
                </$list>
                <$list filter="[{$:/themes/tiddlywiki/vanilla/options/sidebarlayout}prefix[fixed-fluid]]">
                  calc({{$:/themes/tiddlywiki/vanilla/metrics/tiddlerwidth}} - 110px)
                </$list>

                It is called in a stylesheet (type: tiddlywiki) like so:

                width:<<width>>;

                The magic numbers are just approximations; the river gutter and tiddler gutters all 42px but then there are 0-1-2 viewport scrollbars where it seems only one of them affects width... and I'm not sure scrollbars have a fixed width, at least no between browsers so I just made approximations that look decent. Besides, the gutters are hard coded magic numbers so what the hey. At least for my application. However one would need other numbers for small screens where the gutters are gone.

                Tiddler的几个要素

                24th April 2021 at 10:17am
                LearningTiddlyWiki tag
                • Title:在TiddlyWiki唯一标识一个Tiddler,因此不能重复,如果出现重复的话会自动价格数字,也可以自行修改为其他有意义的名称。注意如果使用title的方式来链接一个Tiddler的话,[[title]]双方括号里面的字符是区分大小写的。输入错误的话会无法建立正确的链接,如果链接不到就会自动生成一个title对应的Tiddler。
                • Tag :用来分类收纳一个单独的Tiddler。一个Tiddler可以任意多个Tag,一个tag目的是分类收纳,多个tag实际上主要用途是来快速检索。随便输入一个你记得起来的标签,就可以把它过滤显示出来,从理论上来说,一个Tiddler的tag越多,在后期的搜索中越容易被命中。但是tag也不能多到混乱,也就是失去了意义。
                • Text:也就是你自己要记录的内容。前两个元素都是为这个内容服务的。
                • Type::也就是指定Text里显示哪种类型的文本,比如有markdown、javascript、json Data等各种类型。只是用来记录普通的笔记的话,这里不必理会。
                • Field:如果想进一步了解TiddlyWiki的话,这里是必须要了解的数据结构。包括了很多的灵活的可以自定的字段。最常用的一个比如caption,就是这个Tiddler的标题。有点纳闷不是,前边第一个提到的Title不是这个Tiddler的标题吗?Title实际上是唯一标识这个Tidder的,不另外指定catpion这个字段的话,Title的内用就作为Catpion 。因此,你可以在指定了Title之后,在下面再添加一个caption字段,字段值就是你想要显示的标题,两种不同的话,最终保存后就显示的catption的字段值,而不是Title。

                TiddlerFields

                11th April 2021 at 6:01pm
                MyOwn

                ~TiddlerFields are name:value pairs that make up a tiddler. Field names must be lowercase letters, digits or the characters - (dash), _ (underscore) and . (period).

                The standard fields are:

                Field NameDescription
                titleThe unique name of a tiddler
                textThe body text of a tiddler
                modifiedThe date and time at which a tiddler was last modified
                modifierThe tiddler title associated with the person who last modified a tiddler
                createdThe date a tiddler was created
                creatorThe name of the person who created a tiddler
                tagsA list of tags associated with a tiddler
                typeThe content type of a tiddler
                listAn ordered list of tiddler titles associated with a tiddler – see ListField
                captionThe text to be displayed on a tab or button

                Other fields used by the core are:

                Field NameDescription
                class
                colorThe CSS color value associated with a tiddler
                descriptionThe descriptive text for a plugin, or a modal dialogue
                draft.ofFor draft tiddlers, contains the title of the tiddler of which this is a draft
                draft.titleFor draft tiddlers, contains the proposed new title of the tiddler
                footerThe footer text for a wizard
                hide-bodyThe view template will hide bodies of tiddlers if set to: yes
                iconThe title of the tiddler containing the icon associated with a tiddler
                libraryIndicates that a tiddler should be saved as a JavaScript library if set to: yes
                list-afterIf set, the title of the tiddler after which this tiddler should be added to the ordered list of tiddler titles, or at the end of the list if this field is present but empty
                list-beforeIf set, the title of a tiddler before which this tiddler should be added to the ordered list of tiddler titles, or at the start of the list if this field is present but empty
                nameThe human readable name associated with a plugin tiddler
                plugin-priorityA numerical value indicating the priority of a plugin tiddler
                plugin-typeThe type of plugin in a plugin tiddler
                sourceThe source URL associated with a tiddler
                subtitleThe subtitle text for a wizard
                throttle.refreshIf present, throttles refreshes of this tiddler
                toc-linkSuppresses the tiddler's link in a Table of Contents tree if set to: no
                _canonical_uriThe full URI of an external image tiddler

                The TiddlyWebAdaptor uses a few more fields:

                Field NameDescription
                bagThe name of the bag from which a tiddler came
                revisionThe revision of the tiddler held at the server
                _is_skinnyIf present, indicates that the tiddler text field must be loaded from the server

                Details of the fields used in this ~TiddlyWiki are shown in the control panel under the tab >> sub-tab >> Tiddler Fields

                Tiddlers

                11th April 2021 at 6:01pm
                MyOwn

                Tiddlers are the fundamental units of information in TiddlyWiki. Tiddlers work best when they are as small as possible so that they can be reused by weaving them together in different ways.

                Other systems have analogous concepts with generic names like "items", "entries", "entities", "nodes" or "records".

                Internally, tiddlers are a list of uniquely named values called fields. The only field that is required is the title field, but useful tiddlers also have a text field, and some or all of the standard fields listed in TiddlerFields.

                Tiddlers are ubiquitous in TiddlyWiki. They are used to store everything from JavaScript code modules to the settings and state associated with the user interface.

                TiddllyTextCheatSheet.pdf

                25th April 2021 at 4:34pm
                WikiText WikiText语法

                TiddlyMap!!

                11th April 2021 at 6:02pm

                TiddlyWiki

                24th April 2021 at 11:33am
                LearningTiddlyWiki

                TiddlyWiki is a rich, interactive tool for manipulating complex data with structure that doesn't easily fit into conventional tools like spreadsheets or wordprocessors. TiddlyWiki is designed to fit around your brain, helping you deal with the things that won't fit. The fundamental idea is that information is more useful and reusable if we cut it up into the smallest semantically meaningful chunks – tiddlers – and give them titles so that they can be structured with links, tags, lists and macros. Tiddlers use a WikiText notation that concisely represents a wide range of text formatting and hypertext features. ~TiddlyWiki aims to provide a fluid interface for working with tiddlers, allowing them to be aggregated and composed into longer narratives.

                People love using ~TiddlyWiki. Because it can be used without any complicated server infrastructure, and because it is open source, it has brought unprecedented freedom to everyone to keep their precious information under their own control.

                ~TiddlyWiki was originally created by JeremyRuston and is now a thriving open source project with a busy Community of independent developers.

                Tiddlywiki CSS Prefixes

                Mohammad11th April 2021 at 6:01pm
                solution

                About CSS prefixes: TW uses tc-, tv-, tm- and th- prefixes for different things.

                • tc- tw class
                • tv- tw variable
                • tm- tw message
                • th- tw hook

                Tiddlywiki Favicon

                Mohammad11th April 2021 at 6:01pm
                solution

                When TiddlyWiki starts up in the browser it looks for a tiddler called $:/favicon.ico and dynamically uses it as the favicon for the page. If you modify the image then the favicon changes instantly to reflect it.

                If you put an image (png, jpg, gif) file into a tiddler and then rename the tiddler to $:/favicon.ico it will work. I haven't gotten svg to work yet but I think that is a browser issue, not a tiddlywiki issue.

                See also:

                Tiddlywiki in Open Source

                Mohammad11th April 2021 at 6:01pm
                solution

                Get started and organized with TiddlyWiki

                An article by: Scott Nesbitt

                This is a white paper on Tiddlywiki and its application.

                Ref: opensource.com

                Tiddlywiki in-built CSS Classes

                Mohammad11th April 2021 at 6:01pm
                solution

                TiddlyWiki&GitHub

                30th April 2021 at 9:41am
                LearningTiddlyWiki Save
                • 注册一个GitHub账号
                • 创建一个用于在线编辑TiddlyWiki文件的仓库
                • 把TiddlyWiki单文件命名为index.html,打开这个关于TiddlyWki的GitHub仓库,通过uploade的方式把index.html添加到仓库中,默认保存在main branch中。Github会自动根据你的仓库名称发布一个网址,如https://YourReporzitoryName.github.io
                • 为这个仓库生成一个toker,保存好这个toker,离开这个界面级看不到了,只能再次生成一个新的token,或者删除这个token再生成。
                • 祝贺您,可以在任何一个有互联网的地方来访问你自己的TiddlyWiki笔记了。在浏览器中键入https://yourRepository.github.io
                • 在线打开TiddlywWiki笔记的Control Panel,选择Save标签,选择GitHub Saver,设置下面几项:
                  • UserName:你的GitHub账号
                  • Tokern :在GitHub中生成的token复制到这里即可
                  • Target repository:Username/FullNameOfRepository
                  • Target branch for saving:main
                  • Path to target file :如果index.html放在main分支下的话,这个路径就不必设置了。如果把index.html放置再其他的自定义目录,这里需要设置。这里不必设置
                  • Filename of target file :index.html
                  • Server API URL:https://api.github.com 目前系统默认为GitHub提供的网址,不必自行设置。

                TiddlyWiki&Node.js

                24th April 2021 at 8:50am
                Save

                TiddlyWiki学习资源

                24th April 2021 at 11:32am
                LearningTiddlyWiki

                参考链接 来自:Dimpurr's Knowledge Base #1

                相关阅读

                TiddlyWikiPluginSkeleton: Creating New Plugin

                Mohammad11th April 2021 at 6:01pm
                solution

                The below instruction shows how simply use Node.js for creating new plugin. It uses Thirdflow plugin from TheODive.

                Set Up

                1. Clone or download TiddlyWikiPluginSkeleton from (https://github.com/TheDiveO/TiddlyWikiPluginSkeleton).
                2. install the required tools
                  • run npm install to install the required TiddlyWiki5 core, as well as the ThirdFlow plugin from the NPM registry.
                  • or alternatively use the customised TiddlyWikiPluginSkeleton version by Mohammad (@kookma)
                    • The customized version does not need redundant installation of TW core
                    • The customized version has the ThirdFlow plugin installed

                Develop a new plugin

                1. Make a copy of TiddlyWikiPluginSkeleton from step 2 in your folder of choice
                2. Open command window in TiddlyWikiPluginSkeleton folder
                3. issue the npm run develop command
                4. next, navigate to http://localhost:8080 in your web browser.
                5. follow the instructions given in the "Plugin Kickstarter" to create your plugin.
                6. work on your plugin ... you can freely mix developing things inside the web browser as well as outside the browser using a standalone editor.

                Don't forget to stop and then restart by npm run develop after you've made changes to TiddlyWiki files outside your web browser.

                Release the new plugin

                1. to control which files to release, visit your TiddlyWiki's $:/ControlPanel and go to the ThirdFlow tab. Then click on the subtab named Release. Follow the instructions given there. Please note that you can develop multiple plugins simultaneously from the same development TiddlyWiki.
                2. when you're ready to release, simply run npm run release to create the release file(s) in editions/release/output. Rinse, then repeat as necessary.

                TiddlyWikiTutorial

                24th April 2021 at 5:09pm
                MyContents

                Timimi and Snapshot

                Mohammad11th April 2021 at 6:01pm
                solution

                Timimi is a web-extension that allows you to save standalone tiddlywikis the same way tiddlyfox did. You can open your tiddlywikis from anywhere in your home folder, make changes and save changes. It also support Snapshot plugin, a plugin to backup the wiki. Snapshot only works with Timimi or similar and needs a manual save button to be clicked!

                TOC Macro and Exclude Filter

                Mohammad11th April 2021 at 6:01pm
                solution tocxx

                The toc macro in Tiddlywiki version greater than 5.1.17 does not accept exclude attribute. So, it is not possible to exclude some tiddlers say tagged with ignored from table of contents. Marxsal has introduced a simple hack as below

                Mark S

                You can use the sort argument to sneak in extra, simple requirements:

                sort: "!tag[ignored]sort[title]"

                Example 1

                The below script shows a table of contents with Contents as the root tag and excludes all tiddlers also tag with ignored

                <div class="tc-table-of-contents">
                <<toc-selective-expandable "Contents" sort:"!tag[ignored]sort[title]">>
                </div>

                Example 2: Complex case

                The below script shows a table of contents with Contents as the root tag and excludes all tiddlers have in their name Test. You can also omit sort[title] part.

                <div class="tc-table-of-contents">
                <<toc-selective-expandable "Contents" sort:"!search:title[Test]">>
                </div>

                Todolist

                24th April 2021 at 4:54pm

                A plain todolist

                 

                todolist

                4th May 2021 at 1:55pm

                ToDownload

                26th April 2021 at 5:18pm

                Toggle Button

                Mohammad11th April 2021 at 6:01pm
                exmp080 solution task
                How to have a toggle button to switch two different states like on and off?
                Use $reveal and $button widget and a state tiddler

                Code

                Remarks

                TO BE COMPLETERD

                Examples

                Example i
                A simple on/off button is given below the value sets in state tiddler exmp080/data/state01 can be used for further processing
                Example ii
                In this example the on/off labels have been sent

                Toggle Two Stylesheet

                Mohammad11th April 2021 at 6:01pm
                exmp096 solution
                How to swap (toggle) between two stylesheet?

                How to use

                <<swapper StyleSheet-Edit-Normal StyleSheet-Edit-Large>>

                Toggle UI Elements in Edit Mode

                Mohammad11th April 2021 at 6:01pm
                solution

                Top Level Tiddlers

                Mohammad11th April 2021 at 6:01pm
                solution

                When TW starts a certain page layout is seen- I assume that this layout is determined by a template, with transclusions in it.

                Where do I start reading the code - what's the name of the top-level tiddler ie the template that (or tiddler) that determines how the first thing I see looks on screen?

                Answer

                The top level page template is $:/core/ui/PageTemplate:
                https://github.com/Jermolene/TiddlyWiki5/blob/master/core/ui/PageTemplate.tid
                The top level CSS style template is $:/core/ui/PageStylesheet:
                https://github.com/Jermolene/TiddlyWiki5/blob/master/core/ui/PageStylesheet.tid

                Transclude a Missing Tiddler

                Mohammad11th April 2021 at 6:01pm
                solution

                If you transclude a missing text reference or missing tiddler using {{myTid!!myField}} and/or {{myTid}} nothing is shown and you cannot realize it is missing one solution is to use a macro with a template as proposed by BTS below to address the missing tiddler transclusion:

                • The macro
                Title: TranscludeMissingTiddler
                Tag: $:/tags/Macro
                
                \define trl(text)
                {{$text$||transcludilinktemplate}}
                \end
                • The template
                Title: transcludilinktemplate
                
                <$list filter="[<currentTiddler>is[missing]]">
                <$link to=<<currentTiddler>>><<currentTiddler>></$link>
                </$list>
                <$list filter="[<currentTiddler>!is[missing]]">
                <$transclude/>
                </$list>

                Transclude the Content of Tiddler into a Live Editor

                Mohammad11th April 2021 at 6:01pm
                exmp055 solution

                What it does:

                • The $select widget creates a drop-down list of all the titles matching the tag value (in this example, "exmp055")
                • The current selection is stored in a temporary tiddler, "$:/temp/selected/character" (note: you can use any tiddler title you like)
                • The embedded <style> defines a classname for setting the edit field width (you can't use a style attribute directly in the $edit-text widget)
                • The name of the target tiddler title used by $edit-text is retrieved from the temporary tiddler
                • The remaining $edit-text parameters control how the edit field looks/behaves

                Transclude Tiddlers Into Table

                Mohammad11th April 2021 at 6:01pm
                solution
                A list of figures and their captions are stored in separate tiddlers. How they can be show in a table using transclusion?

                Transcluded Codeblock

                Mohammad11th April 2021 at 6:01pm
                exmp012 solution

                How to transclude a tiddler tagged with $:/tags/highlight/some-language and highlight it using the syntax highlighter in TW?

                TW uses the Highlight.js plugin to do it. To address this case:

                A macro is needed to get the tiddler containing the code and corectly tagged to transclude it as a codeblock with correct language Macro in Exmp 12

                Now you can use <<snip tiddler-title>> to transclude the tiddler as a codeblock highlighted in correct language

                • Exampel

                The tiddler Sample Code in Exmp 12 contains fortran code and is tagged with $:/tags/highlight/fortran. To transclude it in highlighted form inside this tiddler do as below

                Transclusion by Template

                Mohammad11th April 2021 at 6:01pm
                exmp008 solution

                Using template you can transclude different parts of tiddlers and format them. See for more information transclusion with template on Tiddlywiki.com.

                The syntax is as below

                {{title of tiddler||title of template}}
                • Example

                Transclusion in WikiText

                22nd April 2021 at 6:56am
                WikiText

                Introduction

                You can incorporate the content of one tiddler within another using the Transclusion notation:

                • {{MyTiddler}} transcludes a single tiddler
                • {{MyTiddler||TemplateTitle}} displays the tiddler through a specified TemplateTiddler
                • {{||TemplateTitle}} displays the specified template tiddler without altering the current tiddler

                Transcluding Text References

                You can also use a TextReference instead of a tiddler title:

                • {{MyTiddler!!field}} transcludes a specified field of a tiddler
                • {{!!field}} transcludes a specified field of the current tiddler
                • {{MyTiddler##index}} transcludes a specified indexed property of a DataTiddler
                • {{##index}} transcludes a specified indexed property of the current DataTiddler

                Filtered Transclusion

                A similar syntax can be used to transclude a list of tiddlers matching a specified filter:

                {{{ [tag[mechanism]] }}}
                {{{ [tag[mechanism]] ||TemplateTitle}}}

                Generated Widgets

                The WikiText transclusion syntax generates a TiddlerWidget wrapped around a TranscludeWidget. For example, {{MyTiddler||MyTemplate!!myField}} generates the following pair of widgets:

                <$tiddler tiddler="MyTiddler">
                <$transclude tiddler="MyTemplate" field="myField"/>
                </$tiddler>

                See also:

                TW and Search URLs

                Mohammad11th April 2021 at 6:01pm
                solution
                How create a url from other webpage like https://twitter.com to open the tiddlywiki.com and shows directly the result of search in TW?
                you can use arbitrary filters for the permaview part of the location hash. However, it's best to escape the square brackets (browsers typically do this if you copy the address from the address bar).
                • Example

                Open tiddlywiki with all tiddlers contain the firefox keyword in their title.

                https://tiddlywiki.com/#:[!is[system]search[Firefox]]

                TW5 is Really Two Separate Languages

                Mohammad11th April 2021 at 6:01pm
                concept solution

                TW5 is really two separate languages that tackle different dimensions of the problem:

                • A declarative markup language based on HTML for representing widgets. Unlike HTML elements, widgets dynamically create and delete their own child widgets as they “refresh” themselves to track changes to the tiddler store
                • A procedural query language that is philosophically influenced by Forth

                I think the filter language is unique, but it flows very naturally from the idea of a list of titles being the simplest, degenerate filter. Most query languages are declarative, but TW5 filters have a definite sense of sequential execution.

                TW is part of a chorus of new ideas in information management as we move beyond paper-based metaphors for information. Much of TW isn’t unique at all: it is relatively orthodox in hypertext terms, having many of the characteristics that Ted Nelson identified when he coined the term.

                It’s very hard for me to see which of the unique elements of TW’s design might stand the test of time. I suspect that most of them are just provoked by the specific constraints imposed by using the browser as a platform

                One thing I am reasonably confident of is that the discoveries we’ve made through using TW5 are timeless because they’re more about our perception of how our brains work than any particular generation of software: that the only purpose of recording information is to reuse it, and the way to optimise information for reuse is to cut it up into the smallest semantic units and use transclusion to weave it back together into a multiplicity of alternative, different structures. I expect others to formulate these discoveries better, and for them to gradually become mainstream.

                Tweak Sidebar Background

                Mohammad11th April 2021 at 6:01pm
                css solution

                How change the background of sidebar?

                • Create a tiddler
                • Tag it with $:/tags/Stylesheet
                • An put the below content inside it
                • Save
                div.tc-sidebar-scrollable {
                        <$set name="cssVar" 
                            filter="[title[$:/state/sidebar]field:text[yes]]" 
                            value="linear-gradient(to right, transparent, black 5%);" 
                            emptyValue="" 
                        >
                           background: <<cssVar>>
                        </$set>
                }

                Typed Blocks in WikiText

                22nd April 2021 at 6:56am
                WikiText

                WikiText can include blocks of text that are rendered with an explicit ContentType like this:

                $$$image/svg+xml
                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="100">
                  <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="green" />
                </svg>
                $$$

                This renders as:

                It is also possible to abbreviate the ContentType to a file extension. For example:

                $$$.svg
                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="100">
                  <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red" />
                </svg>
                $$$

                This renders as:

                Unknown types render as plain text:

                $$$text/unknown
                Some plain text, which will not be //formatted//.
                $$$

                Which renders as:

                Some plain text, which will not be //formatted//.

                A render type can also be specified, causing a particular text rendering to be displayed. For example:

                $$$text/vnd.tiddlywiki>text/html
                This is ''some'' wikitext
                $$$
                
                $$$text/vnd.tiddlywiki>text/plain
                This is ''some'' wikitext
                $$$

                Renders as:

                <p>This is <strong>some</strong> wikitext</p>
                This is some wikitext

                TypOra

                11th April 2021 at 6:01pm
                MarkDown

                UEFI

                11th April 2021 at 6:01pm
                UEFI&GPT

                UEFI&GPT

                11th April 2021 at 6:01pm
                Windows

                UI to Delete Temporary and State Tiddlers

                Mohammad11th April 2021 at 6:01pm
                exmp069 solution
                How to delete all $:/state and $:/temp tiddlers on demand to refresh TW?
                Use the $action-deletetiddler widget with suitable filter abd $button

                Solution

                The below code implements a simple mechanism to select the desired tiddlers and delete theme one by one or all at once.

                Code

                Remarks

                • The $select widget lets to choose between $:/temp and $:/state
                • The selected option is stored as a filter in status field of exmp067/macro/delete-temp-state tiddler
                • The first $button uses $action-deletetiddler with a filter reads from status field. It removes all tiddlers meet the filter criteria
                • The $list uses a filter reads from status field. It then calls the deleteButton macro where it displays a button and a link to the target tiddler.
                • The deleteButton macro uses $action-deletetiddler widget with $tiddler parameter within the $button widget to selectively deletes the target tiddler

                Inspiration

                • This work inspired from the great codes by Mario Pietsch at Wikilabs
                • The Tiddler Commander has great facilities to do these kind of stuffs quite easily and efficiently.

                Unhide Raw Content of Tiddlers Like Template and Global Macro

                Mohammad11th April 2021 at 6:01pm
                solution
                How to conditionally reveal (display) the raw content of tiddlers?
                Use a view template with proper condition

                Tiddlywiki by default display the wikified contents. To display the raw contents like scripts, html tags, inline styles a view template can be used.

                Example

                Display the raw content of all tiddlers meet one of the below criteria:

                • all system tiddlers with the word template in title
                • all edit templates i.e. those tagged with $:/tags/EditTemplate
                • all edit templates i.e. those tagged with $:/tags/ViewTemplate
                • all global macros i.e. those tagged with $:/tags/Macro

                The below code shows how this example can be implemented. Create a tiddler and tag it with $:/tags/ViewTemplate and put the below code in its text field.

                <$list filter="[all[current]tag[show-content]]
                [all[current]is[system]search:title[template]]
                [all[current]tag[$:/tags/EditTemplate]]
                [all[current]tag[$:/tags/ViewTemplate]]
                [all[current]tag[$:/tags/Macro]] +[limit[1]]">
                <$codeblock code={{!!text}} language="xml" />
                </$list>
                Remarks
                the content of tiddler meets any of above condition will be displayed as codeblock
                if plugin highlight.js is installed the contented will be highlghted using xml language. This is because wikitext script is close to xml.

                Uninstalling a plugin

                21st April 2021 at 6:43pm
                FromTiddlerWiki

                Standalone Configuration

                Follow these instructions when using TiddlyWiki as a standalone HTML file:

                1. Create a backup of your current TiddlyWiki HTML file (just in case)
                2. Open the control panel and go to the Plugins tab
                3. Click on the plugin you want to delete to open it as a standalone tiddler
                4. Click the more button and delete the tiddler
                5. Save your TiddlyWiki
                6. If a yellow warning bar appears at the top of the window, refresh the window so that TiddlyWiki completely removes the plugin
                  • It is no longer necessary to refresh TiddlyWiki when deleting plugins that support dynamic loading. See PluginMechanism for more details
                7. The plugin should no longer be active or available

                Client-Server Configuration

                Follow these instructions when using TiddlyWiki under Node.js:

                1. Quit the server if it is running
                2. Edit the tiddlywiki.info file (it is in JSON format) and locate the plugins and themes section (see below)
                3. Remove the entries corresponding to the plugins you wish to remove. Take care to retain commas to separate items, but do not terminate the last item in a list with a comma
                4. Restart the server
                {
                	"plugins": [
                		"tiddlywiki/codemirror"
                	],
                	"themes": [
                		"tiddlywiki/vanilla",
                		"tiddlywiki/snowwhite"
                	]
                }

                Unique Title

                Mohammad11th April 2021 at 6:01pm
                solution

                Unique Title for State Tiddlers

                Mohammad11th April 2021 at 6:01pm
                exmp117 solution
                How to create a unique permananet id to be used for title of state tiddler?
                use now macro with suitable format

                Tiddlywiki uses qualify macro for creating unique title for state tiddlers. The issue is qualify macro generates different ids based on the situation and is very depenedent to currentTiddler. See for example the good and bad of Qualify.

                A proposed solution

                One solution is to generate unique permamant title using some helpwr function as below

                for example

                Remarks
                the macro create_id_from_timedata creates an id based on current date and time
                the $wikify widget calls create_id_from_timedata and converts the id to plain text
                the $button lets copy the generated if into clipboard and use elsewhere

                Update Fields on Multiple Tiddlers

                Mohammad11th April 2021 at 6:01pm
                solution task
                How to reset the field value on multiple tiddlers?
                list them and then use the action-setfield to set the new values

                Example

                The below code finds all fileds named time_total and grand_total and then reset their value to zero.

                <!-- show tiddlers and values (just so we know it works) -->
                <$list filter="[has[time_total]] [has[grand_total]]">
                   <<currentTiddler>> time_total={{!!time_total}} grand_total={{!!grand_total}}<br>
                </$list>
                
                <!-- HERE'S THE BUTTON -->
                <$button> reset totals
                   <$list filter="[has[time_total]] [has[grand_total]]">
                      <$action-setfield time_total="0" grand_total="0" />
                   </$list>
                </$button>

                Remarks

                • The first $list use two filter runs in OR mode and lists all tiddlers with fields time_total OR grand_total
                • The body of $list displays the found tiddler and the values of those fields if any
                • The next part create a button for action on the tiddler with time_total and grand_total fields
                • The seconf $list widget again lists all all tiddlers with fields time_total OR grand_total and in the body sets time_total="0" grand_total="0"
                Note
                the filter tests for any tiddler that has non-blank values for time_total OR grand_total. If you want to test for tiddlers that have either of those fields, even if blank, use:
                <$list filter="[has:field[time_total]] [has:field[grand_total]]">

                Use Browser Bookmarks for Drag and Drop

                Mohammad11th April 2021 at 6:01pm
                solution
                • A link to a tiddler can be dragged into a different wiki, or
                • dragged to the bookmarks bar then dragged into another wiki for import.

                Use TW Svg Icons in Text

                Mohammad11th April 2021 at 6:01pm
                exmp082 solution
                How to use Tiddlywiki svg icons with body text?
                Tiddlywiki svg icons are big and when used inside text make extra space between lines. The below css setting helps to use aligned svg images with the same font size.
                • The macro gets a tiddler title contains svg
                • The core is a CSS valid color and used as svg fill color

                Example

                Remarks

                The svg tiddler should have no content type. This is very important as the conent type is set to image/svg+xml, the image will be not shown.

                Use Variable in CSS Calc Function

                Mohammad11th April 2021 at 6:01pm
                exmp017 solution
                How is it possible to use the TW variables inside a CSS calc() function?

                There is not any way that works for inline styles, but it works fine if you make a tiddler and tag it with $:/tags/Stylesheet and then define the css in that tiddler with whatever wikitext you want.

                If you can rearrange your tiddlers to have the css defined in its own place that is a solution.

                If you can't than you could use helper macros like this:

                \define makeCSS() width: calc(3em * $(len)$);
                
                • Exampel

                This is a sample code shows a variable width div element, its width is set dynamically by a macro through css using TW variable and css calc function.

                Note: The stylesheet has been defined in stylesheet/Exmp017-Tooltip

                \define makeCSS() width: calc(3em * $(len)$);
                \define xtip(label, tip)
                <$set name="x" value=<<__tip__>> >
                <$list filter="[enlist<x>count[]]" variable="len">
                <div class="xwrapper">$label$
                  <div class="xtip" style=<<makeCSS>>>
                    $tip$<br>
                    ''Number of words'': <<len>>
                  </div>
                </div>
                </$list>
                </$set>
                \end
                
                This is a sample <<xtip "tooltip" "This is a tooltip">> and this is another one <<xtip "next tip" "This is the ''second'' toltip">>.
                • Result

                This is a sample

                tooltip
                This is a tooltip
                Number of words: 4
                and this is another one
                next tip
                This is the second toltip
                Number of words: 5
                .

                Useful Little TiddlyWiki tips

                Mohammad11th April 2021 at 6:01pm
                solution tip

                Control Panel > Info > Basics tips

                Default tidlers
                • Default tiddlers If you use [list[$:/StoryList]] in the default tiddlers it will always load the Home tiddler and the previously open tiddlers
                Username
                • Username for signing edits this can not only be used as a user name, but you can change it for a particular edit session.
                  • For example Tony V0.3 changes then you can list tiddlers created and modified for that edit session.
                  • Consider clicking on the user name in the tiddler subtitles and defining a more descriptive definition in the resulting "user tiddler"
                Title of new tiddlers
                • Title of new tiddlers Set to New {{$:/SiteTitle}} Tiddler for each new tiddler to include the site title
                  • For example the Recipes wiki creates new tiddlers titled New Recipes Tiddler

                Using Google Font with Tiddywiki

                Mohammad11th April 2021 at 6:01pm
                solution
                How to use Google API Fonts in Tiddlywiki?
                1. Create a new tiddler named as you like with the tag $:/tags/RawMarkup and add the link to your font, e.g:

                  Example:

                  <link href='http://fonts.googleapis.com/css?family=Poiret+One' rel='stylesheet' type='text/css'>
                2. Create another tiddler named as you like with the tag $:/tags/Stylesheet and put your css in there, for instance :

                  html span.tc-title{
                    color: red;
                    font-family: "Poiret One", "Impact";
                  }

                See also

                Using Named Colors

                Mohammad11th April 2021 at 6:01pm
                css exmp011 palette solution

                Follow these simple steps to use named colors in your palettes or templates:

                1. create a tiddlerfor your colors, e.g. $:/.mr/colors
                2. set its type to Data dictionary (application/x-tiddler-dictionary)
                3. add entries with descriptive color names, specifying a valid color format
                4. use them in your palette or stylesheets as {{$:/.mr/colors##color-name}}

                Some example colors: * using standard html color names * sample custom color defined in hsla()

                Here's an example using those:

                .fancy{
                background:{{$:/.mr/colors##AliceBlue}};
                color:{{$:/.mr/colors##crimson}};
                border: 2px solid {{$://colors##Beige}};
                border-radius: 10px;
                padding:5px;
                }

                Using Radio Button

                Mohammad11th April 2021 at 6:01pm
                solution

                Also see A Rdio Button Macro

                How to use radio buttons to reveal text in a presistant way?

                <$radio field="section" value="1"> One</$radio>
                <$radio field="section" value="2"> Two</$radio>
                <$radio field="section" value="3"> Three</$radio>
                
                <$reveal state="!!section" type="match" text="1">
                   This is PART ONE
                </$reveal>
                <$reveal state="!!section" type="match" text="2">
                   This is PART TWO
                </$reveal>
                <$reveal state="!!section" type="match" text="3">
                   This is PART THREE
                </$reveal>

                This is PART TWO

                Using Svg in CSS Content Properties

                Mohammad11th April 2021 at 6:01pm
                solution

                The datauri macro returns a data URI for the content of a tiddler.

                It is often used in stylesheet tiddlers to reference things like inline images and fonts:

                background: url(<<datauri "Motovun Jack.jpg">>);

                The data URI is automatically base64-encoded in the case of a non-text tiddler.

                Try the following in a new tiddler tagged $:/tags/Stylesheet on https://tiddlywiki.com:

                \rules only filteredtranscludeinline transcludeinline macrodef macrocallinline macrocallblock
                
                html body.tc-body {
                background: url("<<datauri "Tiddler Fishes.svg">>") center center;
                }

                Using Tiddler Widget with DataTiddler

                Mohammad11th April 2021 at 6:01pm
                datatiddler exmp004 solution tiddler

                Assume you have a data tiddler (dictionary) and you want to list the properties (name/value or index/value) pairs. One solution is using the tiddler widget.

                • Use <$tiddler> widget
                <$tiddler tiddler="Data for Example04">
                
                * Ali is {{##Ali}}
                * Mohammad is {{##Mohammad}}
                * Hirad is {{##Hirad}}
                </$tiddler>

                Because of the surrounding <$tiddler>...</$tiddler> widget, you can omit the tiddlername from the index references so that they will be relative to the "currentTiddler"... which has been set by the <$tiddler> widget to be the appropriate ~DataTiddler. Thus, you only have to change ONE place, instead of "more than a hundred"

                • Results
                • Ali is
                • Mohammad is
                • Hirad is

                Related tiddlers

                  Using TiddlyWiki on Node.js

                  21st April 2021 at 6:48pm
                  FromTiddlerWiki

                  TiddlyWiki5 includes a set of Commands for use on the command line to perform an extensive set of operations based on TiddlyWikiFolders, TiddlerFiles and TiddlyWikiFiles.

                  For example, the following command loads the tiddlers from a TiddlyWiki HTML file and then saves one of them in static HTML:

                  tiddlywiki --verbose --load mywiki.html --rendertiddler ReadMe ./readme.html

                  Running tiddlywiki from the command line boots the TiddlyWiki kernel, loads the core plugins and establishes an empty wiki store. It then sequentially processes the command line arguments from left to right. The arguments are separated with spaces.

                  First, there can be zero or more plugin references identified by the prefix + for plugin names or ++ for a path to a plugin folder. These plugins are loaded in addition to any specified in the TiddlyWikiFolder.

                  The next argument is the optional path to the TiddlyWikiFolder to be loaded. If not present, then the current directory is used.

                  The commands and their individual arguments follow, each command being identified by the prefix --.

                  tiddlywiki [+<pluginname> | ++<pluginpath>] [<wikipath>] [--<command> [<arg>[,<arg>]]]

                  For example:

                  tiddlywiki --version
                  tiddlywiki +plugins/tiddlywiki/filesystem +plugins/tiddlywiki/tiddlyweb mywiki --listen
                  tiddlywiki ++./mygreatplugin mywiki --listen

                  Commands such as the ListenCommand that support large numbers of parameters can use NamedCommandParameters to make things less unwieldy. For example:

                  tiddlywiki wikipath --listen username=jeremy port=8090

                  See Commands for a full listing of the available commands.

                  Variable as DataTiddler Index

                  Mohammad11th April 2021 at 6:01pm
                  datatiddler solution

                  For getting the property value from a data tiddler (dictionary) using a variable, use the below syntax

                  <$transclude tiddler="data-tiddler" index=<<var-name>> />

                  Storing the property value in another variable

                  If you want to store the property value into another variable you can use the set widget as below

                  <$set name="data" tiddler=<<dataTid>> index=<<idx>> >
                  ... the property value can be accessed here using <<data>> variable.
                  </$set>

                  See also DataTiddler Value Set to a Variable for similar example.

                  Variable Class Attribute for Html Tag

                  Mohammad11th April 2021 at 6:01pm
                  solution variable

                  How dynamically set the class attribute of Html tag using Tiddlywiki macros?
                  A macro can accepts class names or aliases or part an abbreviated name and then creates the correct class name to set for the desired Html tag. An example is given below.

                  Example

                  In the below example the class attribute of span tag has been set by makeCls macro.

                  • The setCls accept class aliases as a single input parameter i.e. p
                  • It then split it using space as delimiter and add the prefix mr-dcls- to make the class name
                    • If p is "red yellow" then mr-dcls-red and mr-dcls-yellow will be created.
                  • The macro makeCls then encapsulates all classes. For our example here the macro output will be mr-dcls-red mr-dcls-yellow mr-contents
                  • Finally the class attribute of span tag will be set by a class to makeCls macro as <span class=<<makeCls>>> ... </span>
                  \define makeCls() $(cls)$ mr-contents
                  \define setCls(p)
                  <$set name=cls filter="$p$ +[addprefix[mr-fadeIn-]]">
                  <span class=<<makeCls>> > This is a test </span>
                  </$set>
                  \end

                  The below styles are used in this example

                  <style>
                  .mr-dcls-red{color:red; font-weight:700;}
                  .mr-dcls-yellow{background-color:#ffff00;}
                  .mr-contents{border:1px solid blue;padding:5px;}
                  </style>

                  Demo

                  This demo sets two classes to span element mr-dcls-red mr-dcls-yellow. The mr-contens is always applied.

                  This demo sets only on class to span element mr-dcls-yellow

                  Variable Overriding

                  Mohammad11th April 2021 at 6:01pm
                  solution variable

                  In Tiddlywiki it is possible to override or even overloade a variable. As they have not strict type, overloading is the same as overriding.

                  The following example renders "Ringo" and NOT John, Paul, or George.

                  Variable Reference inside Macro

                  Mohammad11th April 2021 at 6:01pm
                  solution

                  A variable that is defined outside a macro can be referred to within the macro using either $(varname)$ or <<varname>>, depending on context.

                  The difference is that occurrences of $(varname)$ are immediately replaced with the current value of the variable, while <<varname>> is simply returned unchanged as part of the macro output. Thus these are all valid uses:

                  \define mymacro() <$somewidget param="$(currentTiddler)$" />
                  \define mymacro() <$somewidget param="TEXTBEFORE $(currentTiddler)$ TEXTAFTER" />
                  \define mymacro() <$somewidget param=<<currentTiddler>> />

                  but the following is NOT (because it mixes <<...>> inside a quoted parameter value where parsing doesn't occur)

                  \define mymacro() <$somewidget param="TEXTBEFORE <<currentTiddler>> TEXTAFTER" />

                  Variables in WikiText

                  22nd April 2021 at 6:56am
                  WikiText

                  See also the introduction to the concept of variables.

                  To transclude the value of a variable, use the macro call syntax with no parameters. You can also use a widget.

                  A macro snippet can contain $(name)$ as a placeholder for which the value of the variable of that name will be substituted.

                  A variable's value can be used as a filter parameter, or as a widget attribute. The latter supports macro parameters.

                  Example: defining a variable

                  Example: defining a macro

                  The \define pragma below defines a macro called . The macro returns the value of the tiddler's field, and can be accessed from anywhere else in the same tiddler (or in any tiddler that imports it).

                  Example: using a variable as a filter parameter

                  This example uses the operator to list all tiddlers that link to this one.

                  Variables vs. Parameters

                  Mohammad11th April 2021 at 6:01pm
                  solution syntax variable

                  For more details and examples, see: http://pv5.tiddlyspot.com

                  general wiki text, including macros
                  <<variable>>
                  {{transclusion}}
                  <variable>, "<variable>", [[<variable>]]
                  general html element attributes, including widgets, e.g. $macrocall
                  <$widget attribute=<<variable>>/>
                  <$widget attribute=<<callMacroToComputeValue>>/>
                  <$widget attribute={{transclusion}}/>
                  <$widget attribute="prefix-<<variable>>"/>
                  <$widget attribute=[[prefix-<<variable>>]]/>
                  <$widget attribute="prefix-{{transclusion}}"/>
                  within macro body
                  $macroParameter$, "$macroParameter$", [[$macroParameter$]]
                  $(variable)$ (references a variable from the context of the calling macro)
                  <$widget attribute="prefix-$macroParameter$"/>
                  <$widget attribute=$macroParameter$/> (unsafe when having spaces)
                  $variable$, "$variable$", [[$variable$]]
                  macro parameter
                  <<macro param:"$macroParameter$">> (only inside macro)
                  <<macro <<variable>> >>
                  <<macro "<<variable>>" >>
                  <<macro param:<<variable>> >>
                  <<macro {{transclusion}}>>
                  <<macro param:{{transclusion}}>>
                  in filters
                  [$macroParameter$] (only filters within macros)
                  [tag<variable>] (no inner square brackets!)
                  [tag{transclusion}] (only single curly brackets!)
                  [tag[$(variable)$]]
                  [tag[$(variable)$]]

                  See discussion...

                  Variables, Fields and Filters in TiddlyWiki

                  Mohammad11th April 2021 at 6:01pm
                  solution syntax

                  Types of Brackets

                  Brackets are used to indicate the type of operand:

                  • [] - square brackets surround literal values,
                  • {} - curly braces around field references,
                  • <> - angle brackets around variable names.

                  Single or Double Brackets - < vs <<

                  In ~TiddlyWiki content, variables and macros are referenced using <<variableName>>. The double-bracket syntax is used to avoid conflicts with standard HTML syntax (i.e., <b> starts normal HTML bold formatting, while <<b>> embeds the value of a ~TiddlyWiki variable named "b").

                  However, within ~TiddlyWiki filters, there is no need to double the brackets, as HTML is not allowed within the filter, so only single <variableName> is used.

                  Thus, inside a filter we can use a pair of single angle brackets, like this:

                  <$list filter="[is[current]!has<eachfield>]" variable=null>

                  Brackets within filters

                  Why I don't have to wrap <fieldname> with [<fieldname>] in a filter?

                  Think of the brackets in filters as part of the operand itself rather than a "container" for the operand. As explained above, the type of bracket indicates the type of operand being used:

                  • use [...] for literal values, e.g., [texthere]
                  • use {...} for field references, e.g., {!!fieldname}
                  • use <...> for variables e.g. <currentTiddler>

                  Thus, to split the literal text, "sometext", you could write: [title[sometext]splitbefore[t]removesuffix[t]] you would get "some" as a result:

                  Ex: <<list-links "[title[sometext]splitbefore[t]removesuffix[t]]">>

                  If the value "sometext" is stored in a field named "somefield" in the current tiddler, you could write: [{!!somefield}splitbefore[t]removesuffix[t]]

                  and, if the value "sometext" is stored in a variable named "somevariable", you could write: [<somevariable>splitbefore[t]removesuffix[t]]

                  As a slightly more complex example, suppose the value to split on was also stored in a variable. Then you could write: [<somevariable>splitbefore<othervariable>removesuffix<othervariable>]

                  hope this helps,

                  enjoy, -e Eric Shulman

                  ViewTemplate Acts on Child Tiddlers

                  Mohammad11th April 2021 at 6:01pm
                  solution
                  Problem definition
                  Consider parent tiddlers: A, B, C, D, etc. each tagged "parent". Then there are child tiddlers: A1, B1, C2, D2, etc. (they are not tagged "child", but are tagged with the name of the parent tiddler. How create a conditional view template for these child tiddlers?
                  Solution
                  A view template is required to manage the presentation of child tiddlers, and capture any tiddler that is a child of any of the parent tiddlers, without specifying or knowing the name of the parent tiddlers.

                  Template tiddler

                  The below code shows a conditional view template tiddler. You can create a tiddler and tagged it with $:/tags/ViewTemplate

                  <$list filter="[is[current]tags[]]">
                  <$list filter="[<currentTiddler>tag[parent]]">
                  This is a child!
                  </$list>
                  </$list>
                  Remarks
                  The first $list filters all tiddlers have tag and lists its tags
                  The second $list filters tags and see if any of them itself is tagged with parent
                  If the above two conditions met then a message This is a child! is displayed
                  You can use any other commands here to create a more sophisticated output.

                  Example

                  • Create three tiddlers named exmp069/data/Tid01, Tid02, Tid03
                  • Tag all abobe tiddlers with parent
                  • Create six child tiddlers as exmp069/data/Tid01-1, Tid01-2 and so on
                  • Use the above conditional view template to act only on child tiddlers, means each tiddler tagged with a tiddler itself is tagged with parent, e.g
                    • main tiddler exmp069/data/Tid01 is tagged with parent
                    • child tiddler exmp069/data/Tid01-1 is tagged with exmp069/data/Tid01

                  Vlookup

                  16th April 2021 at 10:34pm
                  Excel

                  vlookup函数是Excel中非常强大且经常使用的函数之一,主要是用来在两个有数据项关联的表格之间比对检索,过滤出需要的或者不需要的数据。具体使用方法是要熟悉Vlookup的工作原理:

                  首先是两个表格之间有共同的数据项可以用来关联。
                  其次关联的数据项最好具有唯一性,保证一列数据项里没有重复。比如编号、统一社会信用代码等
                  • Vlookup(arg1,arg2,arg3,arg4)。该函数共四个参数,第一个参数是需要再第二表中查找的数据项,一般是两表关联的数据项,在数据库中可以叫做关键字段;第二个参数是指定目标表格中包含待查找数据的一个矩形数据区域,一般可以用SheetName!$x$y:$x1$y1的绝对引用来表示一个数据区域;第三个参数是指定矩形数据区域包含的要获取到当前单元格数据的索引号;第四个参数是查找方式,一般用0表示精确查询。
                  说明一下第一个参数:是用来关联两个表格的数据项,一般具有唯一性的字段,比如编号等
                  第三个参数是从目标数据区域获取的数据在矩形数据区域排列的索引号。
                  • 如果在函数执行过程中,出现了公式不能检索,而是出现了公式的本身,就是表格在导出时附带了一定的装饰格式,可以使用Excel清除功能仅仅把格式清除,再次执行公式。
                  最后可以描述一下Vlookup函数的运行过程:
                  1.获取第一个参数描述的单元格数值,
                  2.在第二个参数指定的数据区域中检索第一个参数数据值
                  3.如果找到对应的关联数据值,就获取改数据所在的行,再结合第三个参数指定的数据区域的索引号,有了行和列的结合,自然就可以获取这个单元格数据,最终函数返回这个单元格的数据,复制到公式所在的单元格。
                  4.如果所有的行都检索完毕,没有找到关联数据项的值,vlookup函数就返回一个错误的符号。
                  通过了解了vlookup的原理,就可以通过两个键值得关联,在目标数据区域指定要获取的数据的索引号,可以获取关联行的任何一列的数据。

                  • 小技巧:在使用鼠标操作插入函数时,用鼠标选中数据区域时一般为相对引用。可以使用组合键Shift+F4就会自动转换为数据区的绝对引用。

                  VsCode

                  11th April 2021 at 6:01pm
                  MyContents

                  Web

                  21st April 2021 at 9:56pm
                  MyContents

                  WhatIsDNS

                  28th April 2021 at 11:18am
                  DNS
                  • What is DNS

                  DNS, which stands for domain name system, is an Internet service that translates domains names into IP addresses. For example, when you visit KeyCDN.com it must look up the corresponding IP address to that hostname behind the scenes. This query is performed by a Domain Name Server (DNS server) or servers nearby that have been assigned responsibility for that hostname. You can think of a DNS server as a phone book for the internet. A DNS server maintains a directory of domain names and translates them to IPs.

                  When to Use Temp and When to Use State Tiddlers

                  Mohammad11th April 2021 at 6:01pm
                  solution
                  Tiddlywiki uses tiddlers to store global variables and parameters. When use temporary tiddlers and when to use state tiddlers for this purpose?
                  Tiddlywiki normally uses $:/state prefix for state tiddlers and $:/temp prefix for temporary tiddlers
                  • Both $:/temp and $:/state are ignored when determining if the document is "dirty" (see $:/config/SaverFilter)... and by default both are saved when you save the file (except for $:/state/popup, which are NOT saved... see $:/core/save/all)
                  • However, conceptually, $:/temp tiddlers should be "throw-away"... able to be discarded when not actually in use, while $:/state tiddlers should reasonably be expected to persist across sessions.
                  • To enforce this difference, I routinely create a tiddler, tagged with $:/tags/Macro, containing:
                    \define publishFilter() -[prefix[$:/temp]]
                  • This variable is automatically included by the $:/core/save/all filter. The effect is that $:/temp tiddlers are NOT saved when you save the file and are, in effect, automatically discarded at the end of the session.
                  • Thus, if I want a reveal state to always revert to closed on startup, I will use a $:/temp tiddler, but if I want the reveal state to persist across sessions, I will use a $:/state tiddler
                  How keep state tiddlers using Tiddlywiki on Node.js?
                  As Mario explained, the node server uses a config tiddler $:/config/SyncFilter to sync info back to the server. As you can see the default setting contains:
                  [is[tiddler]] -[[$:/HistoryList]] -[[$:/Import]] -[[$:/isEncrypted]] -[prefix[$:/status/]] -[prefix[$:/state/]] -[prefix[$:/temp/]]

                  Just remove the -[prefix[$:/state/]] element from the filter and the state info will be saved back. .. Or use a different name like $:/keepstate.

                  More information

                  Widdly

                  Mohammad11th April 2021 at 6:01pm
                  solution

                  Widdly provides a minimal self-hosted TiddlyWiki5 server written in Go, original form opennota/widdly, and bring proof of concept flat-file & sqlite backends support from xarnze/widdly with much improvements.

                  • Download: Github
                  • Update release v1.2.2,

                  And here are some must to be known: https://github.com/cs8425/widdly#important-to-know

                  WidgetMessage

                  21st April 2021 at 10:47pm
                  Widgets

                  The new tiddler message creates a new draft tiddler and adds it to the current story. It requires the following properties on the event object:

                  NameDescription
                  paramThe optional title of a tiddler to use as a template for the new tiddler
                  paramObjectOptional hashmap of additional tiddler fields
                  navigateFromTitleTitle of the tiddler from which the navigation to the new tiddler was initiated

                  The title for the draft tiddler is chosen according to these rules:

                  • If a hashmap was used and a title field was specified, use that title
                  • If a template tiddler was used, use the title of the template tiddler, making it unique with a numeric suffix
                  • Otherwise, generate a new title based on the default new tiddler title with a numeric suffix to make it unique

                  The new tiddler message is usually generated with the ButtonWidget or ActionSendMessageWidget and is handled by the NavigatorWidget.

                  Examples

                  To make a button that creates new tiddlers tagged "task", create a tiddler called "TaskTemplate" with that tag, and then make your button like this:

                  <$button message="tm-new-tiddler" param="TaskTemplate">New Task</$button>

                  To create a new tiddler with given attributes rather than from a template:

                  <$button>
                  <$action-sendmessage $message="tm-new-tiddler" title="This is newly created tiddler" tags="OneTag [[Another Tag]]" text=<<now "Today is DDth, MMM YYYY">>/>
                  New Tiddler
                  </$button>

                  WidgetMessage: tm-new-tiddler

                  11th April 2021 at 6:01pm
                  MyOwn

                  The new tiddler message creates a new draft tiddler and adds it to the current story. It requires the following properties on the event object:

                  NameDescription
                  paramThe optional title of a tiddler to use as a template for the new tiddler
                  paramObjectOptional hashmap of additional tiddler fields
                  navigateFromTitleTitle of the tiddler from which the navigation to the new tiddler was initiated

                  The title for the draft tiddler is chosen according to these rules:

                  • If a hashmap was used and a title field was specified, use that title
                  • If a template tiddler was used, use the title of the template tiddler, making it unique with a numeric suffix
                  • Otherwise, generate a new title based on the default new tiddler title with a numeric suffix to make it unique

                  The new tiddler message is usually generated with the ButtonWidget or ActionSendMessageWidget and is handled by the NavigatorWidget.

                  Examples

                  To make a button that creates new tiddlers tagged "task", create a tiddler called "TaskTemplate" with that tag, and then make your button like this:

                  <$button message="tm-new-tiddler" param="TaskTemplate">New Task</$button>

                  To create a new tiddler with given attributes rather than from a template:

                  <$button>
                  <$action-sendmessage $message="tm-new-tiddler" title="This is newly created tiddler" tags="OneTag [[Another Tag]]" text=<<now "Today is DDth, MMM YYYY">>/>
                  New Tiddler
                  </$button>

                  Widgets

                  21st April 2021 at 10:40pm
                  FromTiddlerWiki

                  Widgets in Conventional Programming

                  Mohammad11th April 2021 at 6:01pm
                  solution

                  What do set and list widgets?

                  In conventional programming languages the set and list widgets can be explained as below:

                  Set widget

                  The set variable widget assigns a value to a specified variable. The new value of the variable is available to the content within the set variable widget [1].

                  In conventional programming language set is equal to

                  $set name="x" value="" means
                  let x=value .... end

                  List widget

                  The list widget displays a sequence of tiddlers that match a tiddler filter [2]. In conventional programming language set is equal to

                  $list filter=".." variable="i"> means
                  for i=filter
                  output += ... $i
                  end

                  [1]. https://tiddlywiki.com/#SetWidget
                  [2]. https://tiddlywiki.com/#ListWidget

                  Widgets in WikiText

                  22nd April 2021 at 6:56am
                  WikiText

                  Widgets provide rich functionality within WikiText. They have the same syntax as HTML elements, but the tag name always starts with $. For example:

                  <$button message="tm-close-tiddler">Close Me!</$button>

                  Note that widgets inherit all the features of HTML in WikiText:

                  • Widget attributes can be specified as:
                    • Unquoted strings (that cannot contain spaces)
                    • Strings quoted with single or double quotes
                    • Strings quoted with triple-double quotes
                    • Macro invocations (eg attr=<<myMacro>>)
                    • Transclusions (eg, attr={{MyTiddler!!field}})
                    • Filtered transclusions (eg, attr={{{ [filter[op]] }}})
                  • The content of a widget is parsed in inline mode unless the opening tag is followed by two linebreaks, which forces block mode
                    • 'Inline mode' means that 'block mode' parse rules like headings, tables and lists are not recognised

                  See HTML in WikiText for more details.

                  The available widgets include:

                  Wikify Widget and White Spaces

                  Mohammad11th April 2021 at 6:01pm
                  solution

                  The below code is another version of exmp054 . This is a rather tough solution, but it has some intresting point from programming point of view

                  \define gt() 
                  $(TidA)$ $(TidB)$ +[nsort[]last[1]remove[$(TidB)$]]
                  \end
                  
                  \define is-it-newer(TiddlerA, TiddlerB)
                  \whitespace trim
                  <$set name=TidA  tiddler=<<__TiddlerA__>> field="modified">
                  <$set name=TidB  tiddler=<<__TiddlerB__>> field="modified">
                  <$list filter=<<gt>> emptyMessage="no">
                  yes
                  </$list>
                  </$set>
                  </$set>
                  \end
                  
                  > Is `Aa` newer than `Bb`? <<is-it-newer Aa Bb>>
                  
                  > <$wikify text="""<<is-it-newer Aa Bb>>"""  name="result">
                  <$reveal type="match" text="yes" default=<<result>> >
                  Yes, Aa is newer
                  </$reveal>
                  <$reveal type="match" text="no" default=<<result>> >
                  No, Aa is older
                  </$reveal>
                  </$wikify>

                  Remarks

                  • The gt macro returns the greater one of its parameters
                  • The is-it-newer uses gt to see the modification date of which tiddler is newer
                  • The $wikify widget then store the result by is-it-newer macro and
                  • The $reveal widgets compare the result by $wikify widget and displays the final result

                  Important note

                  1. The macro is-it-newer creates some white spaces and this makes the wikified result is different from yes and no in $reveal widget
                  2. You need to add \whitespace trim pargma into is-it-newer to get the correct result
                  3. Passing a maco to text attribute of $wikify without uisng quotes makes wrong wikification, see here.

                  Wikilink ans Rule

                  Mohammad11th April 2021 at 6:01pm
                  solution

                  The below macro creates a links to an external site. When the label is a CamelCase word, TW confuses and instead of pointing to an external link it interpretes the macro output as internal link.

                  To address this issue, the \rules except wikilink is employed.

                  Example

                  • With \rules except wikilink
                    • the link created is correct: TiddlyWiki : https://tiddlywiki.com/
                  • Without \rules except wikilink
                    • the link is wrong: TiddlyWiki : https://tiddlywiki.com/#TiddlyWiki
                  \define makeLink(site link) 
                  \rules except wikilink
                  <a href="$link$" target="_blank">$site$</a>
                  \end
                  

                  WikiText

                  21st April 2021 at 10:59pm

                  ~WikiText is a concise, expressive way of typing a wide range of text formatting, hypertext and interactive features. It allows you to focus on writing without a complex user interface getting in the way. It is designed to be familiar for users of MarkDown, but with more of a focus on linking and the interactive features.

                  ~WikiText can also be inserted to the text field using the Editor toolbar.

                  See Formatting text in TiddlyWiki for an introduction to WikiText.

                  The following elements of WikiText syntax are built into the core:

                  WikiText语法记录

                  26th April 2021 at 8:37am
                  MyOwn WikiText WikiText语法

                  ''两个英文单引号包围文字'' 加粗

                  //斜体// 斜体

                  __下划线__ 下划线

                  ~~删除线~~ 删除线

                  文字^^上角标^^ 文字上角标

                  文字,,下角标,, 文字下角标

                  短破折 -- 线 短破折 – 线

                  长破折 --- 线 长破折 — 线

                  分割线

                  ---

                  代码

                  在代码中使用英文`引号`的方法

                  代码块

                  强制
                  换行
                  实际上在 TiddlyWiki 里正常换行要打两次回车

                  引用

                  引用
                  中的又一
                  个引用

                  一级标题

                  二级标题

                  三级标题

                  • 无序列表
                    • 无序列表中的复合列表
                  1. 有序列表
                    1. 有序列表的复合列表
                  术语
                  定义
                  1. 混合
                    • 列表
                    你想
                    怎样
                    就怎样

                  CSS类可以这样使用

                  引用的站内条目标题 自定义显示的文字

                  IsLinkOmg(自动驼峰链接) ~IsLinkOmg(取消自动驼峰链接)

                  直接显示链接:http://tiddlywiki.com 自定义显示文字 不显示链接只显示纯文字: http://not.alink.com

                  本地链接: file:///c:/Windows/foo

                  相对链接: a 打开就是 tiddlywiki所在路径/a 自定义显示内容 图片:

                  win10桌面壁纸

                  23rd April 2021 at 1:14pm
                  壁纸 Windows

                  一、win10自带壁纸路径:C:\Windows\Web(不建议删除);

                  二、桌面壁纸历史记录删除:计算机\HKEY_CURRENT_USER\Software\Microsoft\Windows\CurrentVersion\Explorer\Wallpapers

                  三、屏锁壁纸历史记录删除:C:\ProgramData\Microsoft\Windows\SystemData\S-1-5-21-3539603992-281004673-205778979-1001\ReadOnly

                  原贴加详情查看/删除 Windows 8/10 锁屏界面壁纸历史记录;

                  四、当前壁纸路径:C:\Users\asus(不是华硕的请将这里ASUS替换成自己电脑的)\AppData\Roaming\Microsoft\Windows\Themes\CachedFiles;

                  五、华硕自带壁纸路径:C:\Windows\ASUS\wallpapers(我是华硕电脑所以加个哈)


                  win10壁纸历史记录在哪里

                  在win10操作系统中,我们在更换桌面的壁纸后在“个性化”界面可以看到之前使用过的壁纸历史记录,如果点击的话还能直接将壁纸换成之前使用过的图片,不少用户反应这样的设置真的非常不人性化,那么有什么办法可以将历史壁纸记录删除掉呢?在本文中winwin7系统小编给大家分享下删除win10壁纸历史记录的操作方法。

                  默认情况下,如果打开“个性化”>“背景”窗口,则“Windows设置面板”将共显示五个壁纸。 它包括四个以前使用的壁纸和当前的一个。 每当你改变壁纸,最后一个从列表中删除。 现在,如果您想要取回该位置的所有默认壁纸以快速更改桌面背景,请使用下面的简单技巧。 您需要使用Windows注册表编辑器。 在使用之前,请确保您已经创建了注册表备份或系统还原点。 如果出现任何问题,您可以随时恢复。 要开始,请打开注册表编辑器。 为此,按Win + I键入regedit,然后按Enter按钮。 或者,您可以在任务栏搜索框中搜索注册表,然后单击结果。 打开注册表编辑器后,导航到以下路径 - HKEY_CURRENT_USER\Software\Microsoft\Windows\CurrentVersion\Explorer\Wallpapers 打开Wallpaper后,您将在右侧找到四个不同的值,分别为BackgroundHistoryPath1,BackgroundHistoryPath2,BackgroundHistoryPath3和BackgroundHistoryPath4。 这是以前使用的四个壁纸。 如何删除Windows10中的墙纸历史记录 您需要右键单击它们并逐个删除它们。 假设您要删除第1张和第4张壁纸。 在这种情况下,请删除BackgroundHistoryPath1和BackgroundHistoryPath4。

                  以上便是win10系统删除历史壁纸的操作方法,由于需要用到注册表进行操作,所在操作之前大家最好先将注册表进行备份(文件 – 导出)。



                  删除 Windows 8/10 锁屏界面壁纸历史记录

                  首先要说明的是 Windows 默认锁屏壁纸在 C:\Windows\Web\Screen 下。然而把它们删除并不能删除历史记录,电脑也仍然会有锁屏壁纸。

                  历史记录的真实路径在 C:\ProgramData\Microsoft\Windows\SystemData 下。(注意 C:\ProgramData 是隐藏文件夹)这个文件夹默认是打不开的。我们需要得到完全控制权。右键-属性-安全-高级,更改所有者,点击高级-立即查找,搜索结果中选择电脑当前用户,确定。

                  查看/删除 Windows 8/10 锁屏界面壁纸历史记录 然后给文件夹添加权限。点击添加-选择主体,和上一步同样方法选择当前用户名,确定。在基本权限中点击完全控制,确定。

                  然后就可以打开了。有两个文件夹,短的那个点开两次有个 lockscreen_z,存放真正默认的锁屏壁纸。长的那个点开,再点 readonly,出现六个文件夹,lockscreen_A 一直到 lockscreen_F。这就是历史图片了。然后大家就可以想干什么干什么了。

                  查看/删除 Windows 8/10 锁屏界面壁纸历史记录

                  顺便一提,锁屏壁纸图片历史记录是不会随着不断更换无限增多的,最多也就六张。

                  Windows

                  11th April 2021 at 6:01pm
                  MyContents

                  WinPE

                  11th April 2021 at 6:01pm
                  Windows

                  Wkify Widget and Macro Variable

                  Mohammad11th April 2021 at 6:01pm
                  exmp051 solution

                  Consider the below example in which a macro output contains some wikitext has been fed to a wikify widget! The widget removes part of formatting:

                  \define mc() This is a `code` and __underline__.
                  <$wikify name="result"  text="""<<mc>>""">
                  <<result>>
                  </$wikify>
                  • The output is: "This is a code and underline."
                  • While it should be: "This is a code and underline."

                  How to solve this issue?

                  Solution

                  In cases like this, the wikiparser does its magic first ... see the below example, where it wikifies the text field of another tiddler, but viewing it with <$view tiddler="someTiddler" mode="block" format="text"/>

                  <$wikify name="something" text="""<$view tiddler="bla" mode="block" format="text"/>""">
                  
                  <<something>>
                  
                  </$wikify>

                  The view widget here assures that the plain text comes in ...

                  In the above example here you have no such "helper". So, you need to change macro as below:

                  \define mc()
                  \rules only
                  This is a `code` and __underline__.
                  \end

                  This way, you prevent the parser from kicking in in this macro block and it works. See Example 51: Rules Only Pragma.

                  Remarks

                  This method is useful when the output of a macro should be written in a tiddler whitout wikifying! In other words the wikitext itself is writte.

                  Working with SVG

                  Mohammad11th April 2021 at 6:01pm
                  exmp059 solution svg
                  How to use svg in TW?
                  PMario instruction has beed given as below

                  First Rule: Remove the svg overhead

                  • Include onle the pure <svg> part.
                  • Remove all additional parameters eg:
                    • <?xml version="1.0" encoding="UTF-8"?> wrapper element
                    • the whole meta data block
                  • Depending on the svg editor software you use and how you save the file, an svg file can contain a lot of editor specific stuff, that is irrelevant for TW. The overhead can be significant, in terms of tiddler size and also usability within TW.

                  Second Rule: Use outline paths

                  • Use outline paths, so they can be filled!
                  • The advantage of the outline is, that we can use CSS fill style setting to change the svg color. eg:

                    .tc-image-chevron-left {
                      fill: green;}

                  Third Rule: Remove all hardcoded styling attributes

                  • The important part now is, we have to remove every fill-attributes from the paths.
                  • Internl stylings (those have been set in tiddler.svg) would always win, so it would not possible to use css
                  • Apply css class definitions instead, if you need to style icon elements.

                  Fourth Rule: Use proper default values

                  • The recommended settings can be as follow:
                    • width="22pt" height="22pt"
                    • viewBox="0 0 128 128"

                  Fifth Rule: Use a proper svg editor

                  • Depending on the editor, svg files can contain a lot of bloat.
                    • Make sure, you have a save option similar to: Optimized SVG in InkScape.
                    • You still have to remove some stuff manually, but the editor specific crap is gone.

                  Sixth Rule: Optimize the svg for size

                  • You can use: SvgOmg. It has a lot of parameters, you can play with, to optimize the image size, without loosing quality.

                  Seventh Rule: Do not embed big images

                  • They only make your TW file big.
                  • As a crude rule of thumb, big is >100 kByte

                  Examples

                    Zero Padded Numbers with Range

                    Mohammad11th April 2021 at 6:01pm
                    solution
                    How use the range operator to produce zero padded number?
                    Write a macro to add the zeros using addprefix operator

                    Example i

                    Generate numbers below 100 all padded with zeros as 001, 002, 010, 055, 099, 100

                    \define zeropad-range(n:10)
                    <$list filter="[range[1,$n$]]" variable=x >
                    <$reveal type="lteq" default=<<x>> text="9" >
                    <$text text= {{{[<x>addprefix[00]]}}} />
                    </$reveal>
                    <$reveal type="gt" default=<<x>> text="9" >
                    <$text text= {{{[<x>addprefix[0]]}}} />
                    </$reveal>
                    </$list>
                    \end

                    Remarks

                    • The list widget generates number using range operator from 1 upto n.
                    • The first reveal widget check number if it is less than or equal to 9 and padded with two zeros.
                    • The second reveal widget checks number if it is greater than 9 and padded with one zero.
                    • The text widget return a simple number padded with required zeros inside reveal widgets.

                    Example ii

                    Produce number by 1000 padded with zeros to have fixed four digits ie: 0001, 0002, 0055, 0285, 0999, 1000

                    \define zeropad-range4(n:10)
                    <$list filter="[range[1,$n$]]" variable=x >
                    <$reveal type="lteq" default=<<x>> text="9" >
                    <$text text= {{{[<x>addprefix[000]]}}} />
                    </$reveal>
                    <$reveal type="gt" default=<<x>> text="9" >
                    <$reveal type="lt" default=<<x>> text="99" >
                    <$text text= {{{[<x>addprefix[00]]}}} />
                    </$reveal>
                    </$reveal>
                    <$reveal type="gt" default=<<x>> text="99" >
                    <$text text= {{{[<x>addprefix[0]]}}} />
                    </$reveal>
                    </$list>
                    \end